Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/basics/nuxt-booster
nuxt-booster will help you to improve the lighthouse performance score (100/100) of your website. 🚀
https://github.com/basics/nuxt-booster
above-the-fold critical-rendering-path font font-loading hydration image image-loading lazy-loading lighthouse nuxt nuxt-font nuxt-module nuxt-modules nuxtjs page-experience-score performance vue vuejs web-vitals webfonts
Last synced: about 2 months ago
JSON representation
nuxt-booster will help you to improve the lighthouse performance score (100/100) of your website. 🚀
- Host: GitHub
- URL: https://github.com/basics/nuxt-booster
- Owner: basics
- License: mit
- Created: 2020-05-19T16:06:05.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2024-09-20T18:30:57.000Z (about 2 months ago)
- Last Synced: 2024-09-21T22:43:18.449Z (about 2 months ago)
- Topics: above-the-fold, critical-rendering-path, font, font-loading, hydration, image, image-loading, lazy-loading, lighthouse, nuxt, nuxt-font, nuxt-module, nuxt-modules, nuxtjs, page-experience-score, performance, vue, vuejs, web-vitals, webfonts
- Language: JavaScript
- Homepage: https://basics.github.io/nuxt-booster/
- Size: 3.35 GB
- Stars: 632
- Watchers: 8
- Forks: 32
- Open Issues: 18
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
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]
[![Renovate - Status][renovate-status-src]][renovate-status-href]
[![License][license-src]][license-href]
- [✨ **Release Notes**](./CHANGELOG.md)
- [👁 **Preview**](https://basics.github.io/nuxt-booster-example/)
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]:
[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