mirror of
https://github.com/searxng/searxng.git
synced 2025-09-08 11:18:32 +02:00
d2b3c92e81
To avoid an `unsafe-inline` in the CSP header, the JS code must be moved to the client side [1]. The `<script>` tag at the end of the HTML originates from the old implementation of the JS client. Since PR-5073 [2] was merged, the `type` is now `module`, and the tag must be moved to the beginning of the HTML. > We need to inline this "JS is enabled?" thing to prevent layout shifts and > temporary "no JS enabled" visuals as ESM scripts loads and evals everything > deferred from initial DOM render [3] That's true in theory, but in practice, this effect is unnoticeable because it's masked by another effect (which we can't avoid): If we load the page with a severely throttled connection, the HTML (result list) takes a long time to load. Then the CSS is loaded, which also takes longer. Until the CSS has loaded, there's no layout. A layout shift is therefore largely determined by the loading of the HTML and CSS itself. The running times of the ESM script can be neglected compared to the loading times of HTML & CSS. [1] https://github.com/searxng/searxng-docker/pull/424#issuecomment-3199494256 [2] https://github.com/searxng/searxng/pull/5073 [3] https://github.com/searxng/searxng-docker/pull/424#issuecomment-3199622504 |
||
|---|---|---|
| .. | ||
| generated | ||
| src | ||
| tools | ||
| .gitignore | ||
| .stylelintrc.json | ||
| biome.json | ||
| package-lock.json | ||
| package.json | ||
| README.rst | ||
| theme_icons.ts | ||
| tsconfig.json | ||
| vite.config.ts | ||
===================== MEMO vite development ===================== Local install:: # in folder ./client/simple/ $ npm install Start development server:: $ ./manage vite.simple.dev # in folder ./client/simple/ $ npm exec -- vite Fix source code:: # in folder ./client/simple/ $ npm run fix Fix & Build:: $ ./manage vite.simple.build