Code-splitting and Lazy-loading Alpine Components using Async Alpine

Code-splitting and Lazy-loading Alpine Components using Async Alpine

With AlpineJs, you can create components in two ways: using inline HTML markup or the Alpine.data() function to define a component globally and use it throughout the entire project.

Each approach has its pros and cons. For example, It is not possible to cache the inline components. And are only reusable if you use your template engine to create reusable components. The benefit of this approach is that you don't need a …

alpinejs async code components cons data example function html lazy loading performance project pros