mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-11-12 23:31:02 +00:00
John Jahn
848e3f90e1
Every lucide icon is its own module, and the plugin icon lookup reaches all of them by name from the navigation. The bundler therefore put each icon another chunk also uses into a chunk of its own: 187 files of a few hundred bytes, each one a request on a first visit and an entry in the precache. A `vendor-icons` group collects them. The first load asks for 32 script files instead of 224 (the bytes stay the same, 3.9 MB before compression), and the service worker installs 460 files instead of 652. With 50 ms added to every response the login page reaches DOMContentLoaded in 0.5 s instead of 3.8 s.
19 lines
982 B
JavaScript
19 lines
982 B
JavaScript
// The chunk group that holds the lucide icons the app loads at startup (vite.config.js).
|
|
//
|
|
// Every lucide icon is a module of its own, and the plugin icon lookup
|
|
// (src/components/shared/PluginIcon.tsx) reaches all of them by name, from the navigation
|
|
// every page renders. Left to itself the bundler puts each icon that some other chunk
|
|
// also uses into a chunk of its own, so that neither side holds a copy: 187 files of a few
|
|
// hundred bytes each, every one a request of its own on a first visit and an entry of its
|
|
// own in the service worker's precache. In one group they are one file, whose hash changes
|
|
// only when lucide-react does.
|
|
//
|
|
// `tags: ['$initial']` for the reason the other groups carry it: without it the group would
|
|
// also take icons that today sit behind a lazy route and make them part of the first load.
|
|
export const ICON_CHUNK = {
|
|
name: 'vendor-icons',
|
|
priority: 20,
|
|
tags: ['$initial'],
|
|
test: /[\\/]node_modules[\\/]lucide-react[\\/]/,
|
|
};
|