tools upgrade

[Rettend]

@ashlsun tools that i like, they all provide better UX and DX.

Minor impact

• npm --> bun/pnpm: faster dep installs, faster vite
• eslint, prettier, eslint-config-prettier .... --> antfu/eslint-config: eslint can be used as a (smarter) formatter and completely replaces prettier, this reduces codebase complexity
• svg icons/font icons --> iconify: uses Pure CSS Icons which is faster, import icon sets as npm modules and only ship what's used. ton of icons here: https://icones.js.org/collection/solar
• local fonts/3rd party fonts --> fontsource: import fonts as npm modules, zero config, fully optimized. .ttf fonts are system fonts and should not be used on the web, the more compressed .woff2 is the web font format. generally, using 3rd parties is bad as it involves extra roundtrips (much worse actually: extra DNS lookups and SSL handshakes) and google also tracks your users. local woff2 fonts are okay but you need a few lines of css to optimize loading, fontsource just does it.

Major impact

• tailwind --> unocss: UnoCSS is the single best tool i have ever used and it's criminally underrated. it is fully compatible with tailwind's syntax but it's much better in every conceivable way. honestly just listing them would be another same size poast. but this might be considered a larger overhaul (mainly deleting tailwind's myriad config files)

[Rettend]

some examples of prettier being primitive (it just watches the line length):

(the closing </span> is broken at the >)

most can be fixed manually and then format will not break them, this is broken:

this way you have better access to the props:

[Rettend]

forgot that you also used a pretty custom font, so just downloading woff and adding font-display: swap should do it. fontsource is for the other common fonts