how to reduce layout shift in astro
im currently in the process of rewriting my old personal site/blog in astro and i have almost finished it. but idk why the layout shift is so huge, please help
deployed version: https://nexxel-dev-v2-6s310ftwp-nexxeln.vercel.app/
80 Replies
I would think giving the body a width: 100% would help, but I can't test it in the browser since it resets the css every reload.
Unrelated, ik, but your old one was so much better imo
i will try this thanks
what do you not like about the new one? i just wanted to have a depressed boring site tbh 
old one got very bloated
old one got very bloated@nexxel how are you loading the font in? I think that's what's making the page jump on load.
swap
self hosted
I'm not super well-versed in fonts but I'd probably mess with that. If you throttle the network and performance, you can see that it loads in another font first, then jumps to the correct layout once it loads in your font.
yes that's what swap does
but idk how to prevent the layout shift here
Well if that was the goal...
It just feels less vibrant and fun
Nothing inherently bad with the design, but yk there's barely any design anyway so
yeah that was kind of the goal :(
i just want a site and not spend anymore time on it
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
yes me too
just help with this layout shift
What's wrong with just living the current one as it is
it has gotten really bloated
and i don't wanna use next
Hm
Of the top of my head. The fonts arnt being cached beacuse they must load in every route change