dev > frontend sheet (head)

Head

<link rel="icon" href="/favicon.ico" sizes="any"><!-- 32×32 -->
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png"><!-- 180×180 -->
<link rel="manifest" href="/manifest.webmanifest">

Manifest

{
   "name":"site title long",
   "short_name":"short",
   "start_url":"\/",
   "lang":"en",
   "display":"standalone",
   "background_color":"#E2E8F0",
   "icons": [
      { "src": "/icon-192.png", "type": "image/png", "sizes": "192x192" },
      { "src": "/icon-512.png", "type": "image/png", "sizes": "512x512" }
   ]
}

CSS

Avoid unused css ! use tailwind with vite for example. It compiles your css to keep only used properties.

If possible defer the css declaration before the </body> tag