Lazy Loading
Overview
A slow component can slow down the loading of an entire page. CBWIRE's lazy loading feature allows you to delay loading your components until the page is fully rendered.
Let's create a slow component that users will hate.
Changing this to a lazy-loaded component is as simple as using wire( lazy=true ).
This will cause Livewire to skip this component on the initial page load. Once visible in the viewport, Livewire will request a network to load the component fully.
Lazy loading also delays the execution of the onMount() lifecycle method.
Placeholder
As your components load, you often want to display some indicator, such as a spinner, to your users. You can do this easily using the placeholder() method.
By default, CBWIRE inserts an empty <div></div> for your component before it loads.
The placeholder and the main component must use the same root element type, such as a div. You will get rendering errors if you don't use the same root element.
Placeholder using ColdBox view
You can render a ColdBox view for a placeholder using the view() method.
Last updated