share me:
Nuxt Booster
Nuxt Booster takes over the Lighthouse performance optimization of your generated website. All used components and resources are loaded on demand based on the viewport.
Getting Started
Please follow the 📖 Documentation
Requirements
- NodeJS
>= 19 - NuxtJS
>= 3.5.0
Features
- dynamic loading of viewport based page resources like fonts, components, pictures, images and iframes
- optional blocking of javascript execution by initial performance measuring
- optimized initial load of javascript files by eliminating of unnecessary javascript files
- prevents the loading of unnecessary resources (including components) that are outside the current viewport.
- optional info layer concept to inform users about a reduced UX when bandwidth or hardware is compromised.
- completely new approach of font declaration
- optimized picture component (supports viewport based sources e.g. landscape/portrait)
- optimized image component
- supports SEO-friendly lazy hydration mode (picture + image)
- optimized youtube/vimeo component (auto generated poster image in different resolutions)
Results
- delivery of the minimum required resources based on the current viewport
- if you use the tools as specified you will get a lighthouse performance score of 100/100
Browsers support
You can use
nuxt-boosterwith Internet Explorer 11 browser. Learn more at Browser compatibility
 IE / Edge |
 Firefox |
 Chrome |
 Safari |
 iOS Safari |
 Samsung |
 Opera |
 Vivaldi |
|---|---|---|---|---|---|---|---|
| Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
Development
- Clone this repository.
- Install dependencies using
npm installoryarn install. - Start development server using
npm run devoryarn dev.
Preview
- Clone this repository.
- Install dependencies using
npm installoryarn install. - Build and start with express
npm run start:generateoryarn start:generate. - Open http://127.0.0.1:3000 in Browser.
or look here
Consulting & Support
Do you need further support, a consultation or a code review for an appropriate fee? Just contact us via eMail: stephan.gerbeth@gmail.com, lammpee@gmail.com. We are looking forward to your request.