lazy node

JS ariato/lazy_node.js


The LazyNode controller allows to defer the loading of a DOM element when it becomes visible. That is very convenient to speedup the initial loading page. For example that sound smart to lazy load heavy parts of the page or content at the bottom.

The div below is a lazy node. Open the network tab to see the XHR request.

Loading ...
Lazy node are recursive

Once the content of a lazy node is injected into the DOM, Ariato initializes the new elements. That means the lazy node content can contain other Ariato controllers. For the fun, let's nest 2 lazy nodes !

Loading ...

Open the netwrok tab to see 2 XHR requests.


A lazy node triggers a bunch of events :

  • Ariato.LazyNode.success
  • Ariato.LazyNode.error
Loading ...