English for Marko Developers
Learn the English vocabulary for Marko: fine-grained streaming, partial hydration, and the compiler-driven performance model behind eBay's UI framework.
Marko conversations center on streaming and hydration terms that overlap with other frameworks but carry a distinct emphasis — Marko markets itself on shipping less JavaScript and rendering incrementally, so precision about those two claims matters.
Key Vocabulary
Fine-grained streaming — Marko’s ability to flush individual sections of HTML to the browser as soon as they’re ready, rather than waiting for the entire page’s data to resolve before sending anything. “The hero image and nav render instantly because of fine-grained streaming — the slow recommendations widget streams in afterward without blocking the rest of the page.”
Partial hydration — attaching client-side interactivity only to the specific components that need it, leaving the rest of the rendered HTML fully static and JS-free. “Only the cart icon needs partial hydration — the product grid underneath it stays static HTML with no attached JavaScript.”
Compiler-driven optimization — Marko’s approach of analyzing a component at build time to generate minimal, highly specific update code, rather than relying on a runtime virtual DOM diff. “There’s no virtual DOM diffing at runtime here — compiler-driven optimization already worked out exactly which DOM nodes need updating when this value changes.”
Tag — Marko’s term for a custom, reusable UI unit, roughly analogous to a component in other frameworks but defined with Marko’s own template syntax. “Extract the pricing table into its own tag so it can be reused across the plans page and the checkout summary.”
Progressive rendering — displaying a page incrementally as data becomes available, giving users meaningful content immediately instead of a blank screen or a full-page spinner. “Progressive rendering means the user sees the article text right away, even while the comments section is still fetching in the background.”
Common Phrases
- “Is this section streaming in as it resolves, or is the whole page waiting on the slowest data source?”
- “Does this tag actually need partial hydration, or is it purely presentational?”
- “Is the compiler-driven optimization here doing what we expect, or is something forcing a full re-render?”
- “Should we split this into more tags for reusability, or is one tag with props enough?”
- “Is this page using progressive rendering, or is a single slow API call still blocking the first paint?”
Example Sentences
Debugging a slow first paint: “The whole page was waiting on one analytics call before rendering anything — restructuring it around fine-grained streaming let the rest of the page flush immediately.”
Explaining an architecture choice: “We chose Marko for this high-traffic page specifically because compiler-driven optimization ships less runtime JavaScript than a virtual-DOM framework would for the same UI.”
Reviewing a pull request: “This tag doesn’t need to be interactive — drop the event handlers and let it stay static instead of triggering partial hydration for no reason.”
Professional Tips
- Use fine-grained streaming, not just “streaming,” to distinguish Marko’s per-section flushing from coarser server-side streaming in other frameworks.
- Justify JS-payload reductions with partial hydration specifically — naming the mechanism is more convincing than a general “it’s lighter” claim.
- Reference compiler-driven optimization when comparing performance against virtual-DOM frameworks — it explains why there’s less runtime overhead, not just that there is.
- Call reusable units tags in Marko-specific contexts to match the framework’s own vocabulary, even though “component” would be understood.
Practice Exercise
- Explain the difference between fine-grained streaming and waiting for a whole page’s data before rendering.
- Describe when a component should get partial hydration versus staying fully static.
- Write a sentence explaining why compiler-driven optimization reduces the need for runtime diffing.