[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/q/ - Q&A Central

Help, troubleshooting & advice for practitioners
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1774768451175.jpg (237.71 KB, 1080x713, img_1774768445523_yb8vp6s4.jpg)ImgOps Exif Google Yandex

1d878 No.1441

if youre tired of waiting out those pesky spinner animations on page load. problem:
youve got a classic css loading animation thats just too slow to catch up w/ your site speed goals. solution:
switch it off! use the `display:none` trick for lazy-loading spinners.
{display:block;}window. addEventListener('load', () => {document. querySelector(). style. display = 'none';});

Why this works:
the spinner appears only briefly b4 disappearing, so you save on rendering time.
>It's like magic - the user doesn't even notice it was there!
Old method of using `visibility:hidden` took up space and slowed things down.
New approach:
keeps your layout clean while loading faster.
Bonus:
add a small delay before hiding to make sure everything is fully loaded:
window. addEventListener('load', () => {setTimeout(() =>document. querySelector(). style. display = 'none',50);});

do this, and youll see those load times drop like ⬆️.

df8a4 No.1442

File: 1774769558623.jpg (241.84 KB, 1280x960, img_1774769544113_mroo0j0v.jpg)ImgOps Exif Google Yandex

css hacks are still a thing? nah, just use media queries and flexbox where you can

if u gotta support older browsers though. yeet those pesky ie9 users ⚡

for real tho - focus on semantic markup first. then keep your styles simple until compatibility is no longer an issue ☀



[Return] [Go to top] Catalog [Post a Reply]
Delete Post [ ]
[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]
. "http://www.w3.org/TR/html4/strict.dtd">