[{"data":1,"prerenderedAt":266},["ShallowReactive",2],{"application-guide-nav":3,"agmd-node-red-oee-central-dashboard":118},[4,12,16,22,25,31,36,42,47,53,58,64,70,75,81,87,93,98,103,108,112],{"guide":5,"slug":6,"title":7,"navOrder":8,"parent":9,"blurb":10,"path":11},"flowfuse","overview","Overview",1,null,"The map of the FlowFuse guide — apps, architectures, and a worked example.","\u002Fapplication-guide\u002Fflowfuse\u002Foverview\u002F",{"guide":13,"slug":6,"title":7,"navOrder":8,"parent":9,"blurb":14,"path":15},"node-red","The map of the Node-RED guide — the pattern families that turn an app into a clean flow.","\u002Fapplication-guide\u002Fnode-red\u002Foverview\u002F",{"guide":5,"slug":17,"title":18,"navOrder":19,"parent":9,"blurb":20,"path":21},"foundations","Foundations",2,"The foundation to build on: what FlowFuse is, its core pieces, and how code is shared across teams.","\u002Fapplication-guide\u002Fflowfuse\u002Ffoundations\u002F",{"guide":13,"slug":17,"title":18,"navOrder":19,"parent":9,"blurb":23,"path":24},"The handful of concepts you need to build with Node-RED, and how they fit together.","\u002Fapplication-guide\u002Fnode-red\u002Ffoundations\u002F",{"guide":5,"slug":26,"title":27,"navOrder":28,"parent":9,"blurb":29,"path":30},"app-delivery-methods","App delivery methods",3,"Two different units of code, delivered two ways. Ship the whole app — a complete, versioned project promoted through environments — or publish one reusable piece — a package the whole team installs and upgrades in one place. Pick by what you're shipping: the app, or a part of it.","\u002Fapplication-guide\u002Fflowfuse\u002Fapp-delivery-methods\u002F",{"guide":13,"slug":32,"title":33,"navOrder":28,"parent":9,"blurb":34,"path":35},"patterns","Patterns","The moves that turn an architecture into a clean, reusable flow — find the seams and reuse well, then handle data on the right paths.","\u002Fapplication-guide\u002Fnode-red\u002Fpatterns\u002F",{"guide":5,"slug":37,"title":38,"navOrder":39,"parent":26,"blurb":40,"path":41},"hardware-apps","Hardware apps",3.1,"The three shapes a FlowFuse app takes when it runs on a device. Pick by how much varies per site: nothing (Packaged App), a few settings (Configurable App), or you assemble it yourself (Edge Building Block).","\u002Fapplication-guide\u002Fflowfuse\u002Fhardware-apps\u002F",{"guide":13,"slug":43,"title":44,"navOrder":39,"parent":32,"blurb":45,"path":46},"design-patterns","Design patterns","The structural choices you select for a flow: find the seams it breaks into, then reuse each piece at the lightest level that solves it — link in\u002Fout, link call, subflow, or packaged node.","\u002Fapplication-guide\u002Fnode-red\u002Fdesign-patterns\u002F",{"guide":5,"slug":48,"title":49,"navOrder":50,"parent":26,"blurb":51,"path":52},"software-apps","Software apps",3.2,"The three shapes a FlowFuse app takes when it runs on the platform. Pick by what it needs: a headless job (Packaged App), a user-facing app driven by data (Data-Driven App), or a reusable piece other apps embed (Shared Building Block).","\u002Fapplication-guide\u002Fflowfuse\u002Fsoftware-apps\u002F",{"guide":13,"slug":54,"title":55,"navOrder":50,"parent":32,"blurb":56,"path":57},"handling-data","Handling data","Classify each signal by shape, purpose and direction, then pick the methods it needs — separate the paths, pace the flow, hold state in context, and manage config. The methods you select to move a flow's data.","\u002Fapplication-guide\u002Fnode-red\u002Fhandling-data\u002F",{"guide":13,"slug":59,"title":60,"navOrder":61,"parent":32,"blurb":62,"path":63},"good-form","Good form",3.3,"A clean flow isn't luck — it's a handful of habits. Wire for reading, lay it out on a grid, decouple UI from logic, catch errors where you can see them, and keep data on a stable contract. Follow these and a flow stays readable, reusable, and out of spaghetti.","\u002Fapplication-guide\u002Fnode-red\u002Fgood-form\u002F",{"guide":5,"slug":65,"title":66,"navOrder":67,"parent":9,"blurb":68,"path":69},"data-plane","Data plane",4,"Before you pick where things run, decide how data is handled. Two stores come built into every FlowFuse server install — the Team Broker and relational Tables — exposed to every instance with nothing extra to stand up. Everything else you bring your own: run it (a time-series DB, an existing database, a model) and expose it to the fleet over Project Link, no inbound ports. This is the data plane the architectures on the next pages all sit on.","\u002Fapplication-guide\u002Fflowfuse\u002Fdata-plane\u002F",{"guide":13,"slug":71,"title":72,"navOrder":67,"parent":9,"blurb":73,"path":74},"worked-examples","Worked examples","Turn an app concept into a Node-RED flow — or a few — leaning on the design patterns and data handling. The method, then the OEE apps end to end.","\u002Fapplication-guide\u002Fnode-red\u002Fworked-examples\u002F",{"guide":13,"slug":76,"title":77,"navOrder":78,"parent":71,"blurb":79,"path":80},"oee-edge-aggregator","OEE - Edge Aggregator",4.1,"The edge app from the OEE use case as a Node-RED flow — a straight-line flow packaged as a subflow and configured per line (its PLC tags, via a config UI and a get-config node), with the data treated as a stream and its counts held in context.","\u002Fapplication-guide\u002Fnode-red\u002Foee-edge-aggregator\u002F",{"guide":13,"slug":82,"title":83,"navOrder":84,"parent":71,"blurb":85,"path":86},"oee-central-dashboard","OEE - Central Dashboard",4.2,"The cloud app from the OEE use case as a Node-RED flow — one link out fanning to two link ins on separate tabs (dashboard and batched history), so the live and history paths stay separate and easy to read.","\u002Fapplication-guide\u002Fnode-red\u002Foee-central-dashboard\u002F",{"guide":5,"slug":88,"title":89,"navOrder":90,"parent":9,"blurb":91,"path":92},"architectures","Architectures",5,"Every FlowFuse deployment is the same building blocks arranged for where it runs — pick the world you're designing for.","\u002Fapplication-guide\u002Fflowfuse\u002Farchitectures\u002F",{"guide":5,"slug":94,"title":95,"navOrder":96,"parent":88,"blurb":9,"path":97},"it-architectures","IT architectures",5.1,"\u002Fapplication-guide\u002Fflowfuse\u002Fit-architectures\u002F",{"guide":5,"slug":99,"title":100,"navOrder":101,"parent":88,"blurb":9,"path":102},"ot-architectures","OT architectures",5.2,"\u002Fapplication-guide\u002Fflowfuse\u002Fot-architectures\u002F",{"guide":5,"slug":104,"title":105,"navOrder":106,"parent":88,"blurb":9,"path":107},"iiot-architectures","IIoT architectures",5.3,"\u002Fapplication-guide\u002Fflowfuse\u002Fiiot-architectures\u002F",{"guide":5,"slug":71,"title":72,"navOrder":109,"parent":9,"blurb":110,"path":111},6,"Start from a use case, break it into apps, and draw the architecture that ties them together — the same method a FlowFuse Proof of Value runs.","\u002Fapplication-guide\u002Fflowfuse\u002Fworked-examples\u002F",{"guide":5,"slug":113,"title":114,"navOrder":115,"parent":71,"blurb":116,"path":117},"worked-example","OEE, end to end",6.1,"One use case — OEE across three lines — broken into two apps and two shared services, then drawn out end to end.","\u002Fapplication-guide\u002Fflowfuse\u002Fworked-example\u002F",{"id":119,"title":83,"blurb":85,"body":120,"description":258,"extension":259,"guide":13,"meta":260,"navOrder":84,"navTitle":83,"navigation":261,"parent":71,"path":262,"seo":263,"slug":82,"stem":264,"__hash__":265},"applicationGuideDoc\u002Fapplication-guide\u002Fnode-red\u002Foee-central-dashboard.md",{"type":121,"value":122,"toc":252},"minimark",[123,126,135,140,192,196,203,207,242],[124,125,83],"h1",{"id":82},[127,128,129,130,134],"p",{},"The cloud app from the FlowFuse ",[131,132,133],"a",{"href":117},"OEE worked example"," — it subscribes to every line's state, computes OEE, shows it live, and writes each reading to history. It runs on one Hosted Instance. Unlike the Edge Aggregator, this one earns a design pattern and more than one data-handling method.",[136,137,139],"h2",{"id":138},"definition","Definition",[141,142,143,151,161,180,186],"ul",{},[144,145,146,150],"li",{},[147,148,149],"strong",{},"The app"," — subscribes to every line's state, computes OEE, shows it live, and writes each reading to history.",[144,152,153,156,157,160],{},[147,154,155],{},"Design pattern"," — ",[131,158,159],{"href":46},"link out \u002F link in",": the OEE result leaves the calc through one link out; a link in on the dashboard tab and a separate link in on the history tab pick it up — a clean fan-out across tabs with no cross-tab wire.",[144,162,163,156,166,169,170,175,176,179],{},[147,164,165],{},"Data handling",[131,167,168],{"href":57},"classify"," (a live event stream, plus history) → the two link-ins ",[147,171,172],{},[131,173,174],{"href":57},"separate the paths"," (live vs history) → ",[147,177,178],{},"batch"," the history writes.",[144,181,182,185],{},[147,183,184],{},"Runs on"," — one Hosted Instance.",[144,187,188,191],{},[147,189,190],{},"Why this shape"," — a user-facing app driven by live data, with history kept off the live path so the dashboard never waits on the database.",[136,193,195],{"id":194},"the-flow","The flow",[197,198],"flow-diagram",{":edges":199,":legend":200,":nodes":201,"align":202},"[\"sub>oee\",\"oee>lout\",{\"from\":\"lout\",\"to\":\"lindash\",\"dashed\":true,\"label\":\"link\"},{\"from\":\"lout\",\"to\":\"lindb\",\"dashed\":true,\"label\":\"link\"},\"lindash>dash\",\"lindb>batch\",\"batch>db\"]","[{\"line\":\"neutral\",\"dashed\":true,\"label\":\"link out → link in\"}]","[{\"id\":\"sub\",\"label\":\"MQTT in\",\"sub\":\"subscribe · line state\",\"accent\":\"indigo\",\"col\":1,\"row\":1},{\"id\":\"oee\",\"label\":\"compute OEE\",\"sub\":\"availability × perf × quality\",\"col\":2,\"row\":1},{\"id\":\"lout\",\"label\":\"link out\",\"sub\":\"broadcast the result\",\"accent\":\"indigo\",\"col\":3,\"row\":1},{\"id\":\"lindash\",\"label\":\"link in\",\"sub\":\"dashboard tab\",\"accent\":\"indigo\",\"col\":3,\"row\":2},{\"id\":\"dash\",\"label\":\"dashboard\",\"sub\":\"live OEE per line\",\"accent\":\"indigo\",\"col\":4,\"row\":2},{\"id\":\"lindb\",\"label\":\"link in\",\"sub\":\"history tab\",\"accent\":\"indigo\",\"col\":3,\"row\":3},{\"id\":\"batch\",\"label\":\"join \u002F batch\",\"sub\":\"N readings or T secs\",\"col\":4,\"row\":3},{\"id\":\"db\",\"label\":\"time-series DB\",\"sub\":\"external · history\",\"accent\":\"green\",\"col\":5,\"row\":3}]","left",[136,204,206],{"id":205},"why-these-choices","Why these choices",[141,208,209,220,226,232],{},[144,210,211,214,215,219],{},[147,212,213],{},"Link out, two link ins on separate tabs"," — the OEE result leaves the calc once through a link out; the dashboard tab and the history tab each pick it up through their own link in. Nothing crosses tabs, so each path reads on its own and the split is named — not a wire snaking across the canvas. (For two consumers on the ",[216,217,218],"em",{},"same"," tab a plain node with two outputs would do; the link out\u002Fin earns its keep because these live on separate tabs.)",[144,221,222,225],{},[147,223,224],{},"The link-ins are the path split"," — the live dashboard rides one, batched history the other; neither waits on the other.",[144,227,228,231],{},[147,229,230],{},"Batch the writes"," — the history link in feeds a join \u002F batch node, so readings land in the time-series DB in batches, not one insert per reading — cutting per-write overhead.",[144,233,234,237,238,241],{},[147,235,236],{},"Decouple UI from logic"," — the compute path builds a display-ready view-model; the widgets render it and emit intent. That's ",[131,239,240],{"href":63},"good form",", not a selection — it applies to every dashboard.",[243,244,246],"callout",{"icon":245},"i-lucide-check",[127,247,248,251],{},[147,249,250],{},"In one line"," — subscribe → compute → link out; one link in to the dashboard tab, a separate link in to a batch node then history.",{"title":253,"searchDepth":67,"depth":67,"links":254},"",[255,256,257],{"id":138,"depth":19,"text":139},{"id":194,"depth":19,"text":195},{"id":205,"depth":19,"text":206},"The cloud app from the FlowFuse OEE worked example — it subscribes to every line's state, computes OEE, shows it live, and writes each reading to history. It runs on one Hosted Instance. Unlike the Edge Aggregator, this one earns a design pattern and more than one data-handling method.","md",{},true,"\u002Fapplication-guide\u002Fnode-red\u002Foee-central-dashboard",{"title":83,"description":258},"application-guide\u002Fnode-red\u002Foee-central-dashboard","s2EIB9jm5cDUuWx2yt-C1qCWN_XXNFdLxt2TLvX_310",1787070953971]