share me:
![nuxt-booster][logo]
# Nuxt Booster
[![main][github-workflow-main-src]][github-workflow-main-href]
[![next][github-workflow-next-src]][github-workflow-next-href]
[![Sonarcloud Status][sonarcloud-src]][sonarcloud-href]
[![npm version][npm-version-latest-src]][npm-version-latest-href]
[![npm downloads][npm-downloads-src]][npm-downloads-href]
[![TypeScript][typescript-badge-src]](http://www.typescriptlang.org/)
[![Renovate - Status][renovate-status-src]][renovate-status-href]
[![License][license-src]][license-href]
- [✨ **Release Notes**](./CHANGELOG.md)
- [👁 **Preview**](https://basics.github.io/nuxt-booster/playground/)
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**](https://basics.github.io/nuxt-booster/)
- **v2**: [basics.github.io/nuxt-booster/v2/](https://basics.github.io/nuxt-booster/v2/)
## 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
📖 [Read more](https://basics.github.io/nuxt-booster/)
## Browsers support
> You can use `nuxt-booster` with **Internet Explorer 11** browser. [Learn more at Browser compatibility](https://basics.github.io/nuxt-booster/caveats#browser-compatibility)
| [
](http://godban.github.io/browsers-support-badges/)
IE / Edge | [
](http://godban.github.io/browsers-support-badges/)
Firefox | [
](http://godban.github.io/browsers-support-badges/)
Chrome | [
](http://godban.github.io/browsers-support-badges/)
Safari | [
](http://godban.github.io/browsers-support-badges/)
iOS Safari | [
](http://godban.github.io/browsers-support-badges/)
Samsung | [
](http://godban.github.io/browsers-support-badges/)
Opera | [
](http://godban.github.io/browsers-support-badges/)
Vivaldi |
| --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
## Development
1. Clone this repository.
2. Install dependencies using `npm install` or `yarn install`.
3. Start development server using `npm run dev` or `yarn dev`.
## Preview
1. Clone this repository.
2. Install dependencies using `npm install` or `yarn install`.
3. Build and start with express `npm run start:generate` or `yarn start:generate`.
4. Open [http://127.0.0.1:3000](http://127.0.0.1:3000) in Browser.
or look here
- [Preview](https://basics.github.io/nuxt-booster/playground)
## Consulting & Support
Do you need further support, a consultation or a code review for an appropriate fee? Just contact us via eMail: , . We are looking forward to your request.
## License
[MIT License](./LICENSE)
[logo]: https://repository-images.githubusercontent.com/265295866/5cf41209-5402-4479-a5f6-29c6b1c0d7ce "nuxt-booster"
[renovate-status-src]:
[renovate-status-href]:
[typescript-badge-src]: https://img.shields.io/badge/%3C%2F%3E-TypeScript-%230074c1.svg
[github-workflow-main-src]:
[github-workflow-main-href]:
[github-workflow-next-src]:
[github-workflow-next-href]:
[sonarcloud-src]:
[sonarcloud-href]:
[license-src]: https://img.shields.io/npm/l/nuxt-booster.svg?style=flat-square
[license-href]: https://npmjs.com/package/nuxt-booster
[npm-version-latest-src]: https://img.shields.io/npm/v/nuxt-booster/latest.svg?
[npm-version-latest-href]: https://npmjs.com/package/nuxt-booster/v/latest
[npm-downloads-src]: https://img.shields.io/npm/dt/nuxt-booster.svg?style=flat-square
[npm-downloads-href]: https://npmjs.com/package/nuxt-booster