40:null 41:["$","title",null,{"children":"Learning Observable: Reactive dataflow | Observable | Observable"}] 47:[{"id":"2c2bfc614924a4981150686ab2c29769790249539e23b4a9cef45fdde8f0f2c292493c72a53de68906f4bf7cfc636e44cbc1d5a5ac945170533121ffc4190c31","href":"https://static.observableusercontent.com/files/2c2bfc614924a4981150686ab2c29769790249539e23b4a9cef45fdde8f0f2c292493c72a53de68906f4bf7cfc636e44cbc1d5a5ac945170533121ffc4190c31","name":"minimap-icon.png","type":"image/png","lastModified":1664311977120.393,"size":605},{"id":"ed499bdaaf793c76d2a5f238019fe8743ca30ffe6219bb7b3f1276cc6190c6a12546e962505f71d98ee6212ef5b17102524733bbb87721a1cd25a59463ba34f6","href":"https://static.observableusercontent.com/files/ed499bdaaf793c76d2a5f238019fe8743ca30ffe6219bb7b3f1276cc6190c6a12546e962505f71d98ee6212ef5b17102524733bbb87721a1cd25a59463ba34f6","name":"minimap3.mov","type":"video/quicktime","lastModified":1671161370499.537,"size":1946029},{"id":"a0312ab0041d2b372074c33e33245c65193344f829651bf4b154a2ffdb6a4cdc36ad42e7bca10f11cc2a96f144914ab64b815f25ee39900be796abc1746d15ce","href":"https://static.observableusercontent.com/files/a0312ab0041d2b372074c33e33245c65193344f829651bf4b154a2ffdb6a4cdc36ad42e7bca10f11cc2a96f144914ab64b815f25ee39900be796abc1746d15ce","name":"minimap.mov","type":"video/quicktime","lastModified":1671160953651.486,"size":2766053},{"id":"528ac750141e3c010df0316b91981b6011da227673b2b6fcf0ed75d6520c55729137b0105f8f36a1d4151fce8b0d65c99c2af634bbc5bf88dec56c6a771ada83","href":"https://static.observableusercontent.com/files/528ac750141e3c010df0316b91981b6011da227673b2b6fcf0ed75d6520c55729137b0105f8f36a1d4151fce8b0d65c99c2af634bbc5bf88dec56c6a771ada83","name":"minimap2.mov","type":"video/quicktime","lastModified":1671160843134.316,"size":1597136},{"id":"acbc5a6fa71fd5c1239b1c9bd00beabb80258f68ab01960cdf3abd585b4d284d9ad624fdd498a5db02b5076dfcad92aa6b9e32652026860541d9b1a2ffd3769f","href":"https://static.observableusercontent.com/files/acbc5a6fa71fd5c1239b1c9bd00beabb80258f68ab01960cdf3abd585b4d284d9ad624fdd498a5db02b5076dfcad92aa6b9e32652026860541d9b1a2ffd3769f","name":"new-users-course-minimap.png","type":"image/png","lastModified":1671033085804.922,"size":476441},{"id":"9979a641c5c1d10e2a539e490c83e51c80cce67477de6f1863f67cdaef11916aa7f221907b6d69fb1a8cc943c6f4faa62825f87b3e342142634d28f382fcd731","href":"https://static.observableusercontent.com/files/9979a641c5c1d10e2a539e490c83e51c80cce67477de6f1863f67cdaef11916aa7f221907b6d69fb1a8cc943c6f4faa62825f87b3e342142634d28f382fcd731","name":"new-users-course-sm-minimap.png","type":"image/png","lastModified":1671161834214.407,"size":225496}] 45:{"id":"f23b4cd68fd24d33","slug":"learning-observable-reactive-dataflow","title":"Learning Observable: Reactive dataflow","thumbnail":"dcf5695055371c718600678a07e9cfc898da9c501028ff86a8b11956c08fc305","access_level":"public","create_time":"$D2022-09-21T17:04:14.047Z","update_time":"$D2023-01-17T23:23:33.543Z","view_time":null,"first_public_time":"$D2023-01-17T23:39:39.720Z","has_unpublished_edits":null,"fork":false,"stars":11,"starred":false,"owner":{"type":"team","id":"f35c755083683fe5","login":"observablehq","name":"Observable","avatar_url":"https://avatars-next.observableusercontent.com/424c6c1f7794371c9915a160519bdfb34cf34e50069fcd6def38a1a04d4e9702","tier":"enterprise_2024","bio":"The end-to-end solution for building and hosting better data apps, dashboards, and reports.","following":false},"version":158,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"ce771552211c04ab","login":"rkosara","name":"Robert Kosara","avatar_url":"https://avatars-next.observableusercontent.com/105903f7d3ac285a1489b547eecce8f57bd15052862a307c4c2242f847d44a67","tier":null,"bio":"","following":false},{"type":"individual","id":"b71e24965feea6d8","login":"allisonhorst","name":"Allison Horst","avatar_url":"https://avatars-next.observableusercontent.com/323c217177f0f20e4e8ed3aa302fec1408cf22b57cbd726e37e76182d5f82a65","tier":null,"bio":"Stats | Art | Data Science | SciComm | Teaching","following":false},{"type":"individual","id":"42520cea6c99d3c8","login":"pstuffa","name":"Paul Buffa","avatar_url":"https://avatars-next.observableusercontent.com/32c09bb97a2bb742225b949dcc4cf81a03dcd2b0caae97325970223a48a14b94","tier":null,"bio":"","following":false}],"members":[{"type":"team","id":"f35c755083683fe5","login":"observablehq","name":"Observable","avatar_url":"https://avatars-next.observableusercontent.com/424c6c1f7794371c9915a160519bdfb34cf34e50069fcd6def38a1a04d4e9702","tier":"enterprise_2024","role":"editor"}],"comments":[{"id":"0982c439e29c2355","reply_to_id":null,"content":"Think we can remove this, since it's covered in another section? Felt a little out of place here.","create_time":"$D2022-12-16T03:31:36.912Z","update_time":null,"resolved":false,"user":{"type":"individual","id":"42520cea6c99d3c8","login":"pstuffa","name":"Paul Buffa","avatar_url":"https://avatars-next.observableusercontent.com/32c09bb97a2bb742225b949dcc4cf81a03dcd2b0caae97325970223a48a14b94","tier":null}},{"id":"5381095f034e4ebf","reply_to_id":"0982c439e29c2355","content":"Yeah agreed, not sure why this ended up here","create_time":"$D2022-12-16T16:20:24.643Z","update_time":null,"resolved":false,"user":{"type":"individual","id":"ce771552211c04ab","login":"rkosara","name":"Robert Kosara","avatar_url":"https://avatars-next.observableusercontent.com/105903f7d3ac285a1489b547eecce8f57bd15052862a307c4c2242f847d44a67","tier":null}}],"custom_thumbnail":true,"trashed":false,"lapsed":null,"subscribed":null,"forks":10,"collection":{"id":"006ed01fc601e47e","slug":"intro-to-observable","title":"Learning Observable","owner":{"id":"f35c755083683fe5","login":"observablehq","name":"Observable"}},"type":"notebook","body":{"titling":"auto","title":"Learning Observable: Reactive dataflow","cells":[{"id":0,"value":"# Learning Observable: Reactive dataflow","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":85,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":122,"value":"We previously introduced Observable's [reactive model](https://observablehq.com/d/b64494e58131b26a?collection=@observablehq/intro-to-observable#cell-51) for cell execution. Here, we'll dig a bit deeper into how it works, features to help you understand and update your notebooks' organization, and advantages of the reactive dataflow.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":10,"value":"Observable is different from vanilla JavaScript because it organizes code and data into _cells_ that it re-runs automatically as needed. You can think of this as working like a spreadsheet, where you can write calculations and enter values. \n\nObservable knows which cells depend on which others, no matter where they are located in the notebook. So when one of them changes, all values that depend on it are automatically updated. This is also efficient: only those cells that are affected by a change are re-run. That means that you can organize cells in your notebook however you want, without worrying about how the order of operations may be affected. \n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":23,"value":"The `value` cell below is used in two other cells, one before and one after it in the notebook. Whenever you change its value by moving the slider, both dependent cells will update.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":16,"value":"squared = value * value","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"viewof value = Inputs.range([0, 100], {label: \"Value\", step: 1})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"doubled = value * 2","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":137,"value":"Learn more about [How Observable Runs](https://observablehq.com/@observablehq/how-observable-runs). ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":26,"value":"## The Minimap\n\nWe can see how this works by looking at the [_Minimap_](https://observablehq.com/@observablehq/minimap?collection=@observablehq/visualizing-debugging-notebooks). Open it by clicking the Minimap button ${await FileAttachment(\"minimap-icon.png\").image({width: 19})} in the sidebar on the right and then click the cell named `value` inside it (or click within the cell in the document).\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":98,"value":"