Code splitting and lazy-loading components for Alpine.js!
Async Alpine is a wrapper around the Alpine.js JavaScript framework that allows you to load components asynchronously on-demand.
Alpine.js is a fantastic framework but with a large site with lots of components, the bundle size can start to become a performance problem!
Async Alpine allows you to split your components into multiple component files and only load them when they're needed, speeding up your first load!
Using a CDN:
<script defer src="https://cdn.jsdelivr.net/npm/async-alpine@2.x.x/dist/async-alpine.script.js"></script>
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>Using npm:
npm install async-alpineFor more info check out our Getting Started guide.
Read our full documentation on our website.
If you've found an incompatibility, bug, limitation or have a feature request file an issue and we'll take a look.
For advice on how best to install or use Async Alpine or general questions about the project create a Discussion.
Have you found some bugs you want to help us fix, or do you have some great ideas that would improve Async Alpine? That's great! Before diving in file an Issue and let us know what you're planning and we can get you contributing!
This project is licensed under the Apache-2.0 license.
The full license is included at LICENSE.md, or at apache.org/licenses/LICENSE-2.0.
Copyright © Alistair Shepherd.