BrowserUX Preload Assets

Boost your web interface performance by intelligently preloading critical resources.

BrowserUX Preload Assets is a configurable Vite plugin that simplifies the injection of <link rel="preload"> and <link rel="preconnect"> tags for essential images, fonts, JS, and CSS files. Using explicit configuration or HTML markup attributes, you stay in control of which resources are prioritized during the initial load. Compatible with light/dark themes (via BrowserUX Theme Switcher) and Google Fonts, it improves rendering speed.

Download v1.2.3

Plugin for Vite
See the CHANGELOG

npm install vite-plugin-preload-assets

Features

- 📷 Automatically preloads images marked with data-preload
- 🌗 Handles dark mode variants (when using browserux-theme-switcher) and preloads them as well (e.g. logo-dark.png)
- 🧠 Preloads critical JS/CSS files by matching configured names dynamically in the build output
- 🔤 Preloads fonts via configuration (fontsToPreload)
- 🌐 Automatically injects link rel="preconnect" tags for Google Fonts (fonts.googleapis.com, fonts.gstatic.com)
- 🚀 Optimizes initial load performance with zero manual effort
- 🧼 No manual HTML changes required