|
|
| Line 123: |
Line 123: |
|
| |
|
| === Architecture Diagram === | | === Architecture Diagram === |
| | <a href="http://i.imgur.com/L5LC0tj"><img src="http://i.imgur.com/L5LC0tj.png"></a> |
|
| |
|
| An architecture diagram illustrates how the various components of the service communicate with one another.
| | External services, marked in yellow, communicate to the server which acts as a notification event proxy. |
| | |
| The goal of the architecture diagram is to give the audience a high-level visual representation of how the different components of a system will interact together.
| |
| | |
| An example of this is the diagram below, which is from the old Mozilla F1 service.
| |
| | |
| [https://wiki.mozilla.org/images/thumb/7/78/F1design.png/392px-F1design.png Mozilla F1 Architecture Diagram]
| |
| | |
| The F1 service had multiple components:
| |
| * a Firefox Add-on that hosted a pane loaded from the Mozilla F1 service that facilitated posting ('sharing') content across multiple services
| |
| * a back-end that abstracted the 'sharing' process such that a core set of common functions to facilitate easy incorporation of addition services without client updates
| |
| | |
| Rather than providing a detailed assessment of how messages are passed between the various components, this diagram illustrates how the different components interact with one another, but not details about the interactions, or what data is shared between them.
| |
| | |
| The goal of this diagram is to provide a concise overview of the system that provides a frame of reference when someone new to the system is reviewing supporting documentation or code.
| |
| | |
| ==== Key Attributes ====
| |
| * Clarity; brief descriptions of which components are communicating
| |
| * Illustrates the boundaries between different services
| |
| | |
| ==== Additional Examples ====
| |
| * [https://people.mozilla.com/~yboily/identity/assets/images-1/s31.b.jpeg BrowserID Protocol High Level]
| |
| * [https://people.mozilla.com/~ckoenig/App-Marketplace.jpg Apps MarketPlace] TODO - Replace Me With A Simple Diagram!
| |
|
| |
|
| === Detailed Application Diagram === | | === Detailed Application Diagram === |