Rehydration

Problemse to solve:

  • Understand where the view boundries are when doing re-hydration
  • Know how to trigger events and lazy load handlers
  • Know how to lazy load components









<my-app ~ng="0">
  <h1>Title!</h1>
  <child ~ng="1">
    <span ~ng="click:2">OK</span>
    <!--~ng=1-->Hello World!
    <div><b>user</b><!--~ng--> comment</div>
  </child>
  <footer>footer</footer>
</my-app>






cost NG_HYDRATION = [
  ref_to(MyApp),  // these refs need to be lazy loadable
  ref_to(Child),
  ref_to(clickFn),
];

Legend for ~ng:

  • 123: view ID
  • (click:123): listener: if detected hydrate
  • (blank): ignore this as it is user content.

Rules for lazy loading:

  • If event happens trigger loading for that component
Select a repo