Dette var uken for late dager 🐼, optimalisering av prod-kode 📈 og en ny utfordrer på jerntronen ⚔️🐉.
Og 20.019 ting skjedde i frontend-verdenen!
Er CSS-en din kjapp nok?
Jeg har aldri tenkt over performance på CSS, og har på en måte bare regna med at akkurat det ordner browseren selv. 🤦 Men det har seg altså sånn at det er forskjeller på hvor effektiv nesting og selectorer er.
I denne artikkelen får man en pekepin på hvordan man kan måle ytelsen til CSS’en man har skrevet (forfatteren bruker Edge, men du finner det samme i Performance-tabben i Chrome 🤠), og noen reale tips til hvordan man kan optimalisere selectorene sine hvis resultatet ikke var spesielt lovende.
Og skulle ikke tipsene være nok, får du noen ekstra tips signert MDN.
Utskjelte Safari slår tilbake: - Hennes arbeid har gitt resultater
Kunsten å balansere en tittel 📏
Har du noen ganger opplevd at overskriften blir akkurat litt for lang, og et ord brytes over på neste linje? Kanskje blir det seende mer ubalansert ut en lorem ipsumen fra skissene. ⚖️
Det er nå altså et bibliotek på banen som hjelper med akkurat dette! RW justerer overskriftene så det ikke blir noen dinglende ord for seg selv. Du har selv muligheten til å konfigurere akkurat hvordan man ønsker at forholdene mellom linjene skal være, og biblioteket gjør resten. Og det på under å koste bundle-størrelsen på appen din 1kb! 🏎
I denne artikkelen skriver Vercel litt om dilemmaet med tekstbalansering, algoritmen bak, og hvordan de har løst Layout shift med løsningen sin.
Å bruke løfter effektivt 🎓
Vi blir aldri helt ferdige med Promise-apiet. Det er flere fallgruver å gå i, enten det er callback-hell, feilhåndteringen eller evig chaining. Denne uken får vi hjelp til å se på hvordan man kan gjøre flere uavhengige promises, samtidig!
I bloggposten får vi en gjennomgang av hvordan man kan bruke All, AllSettled, Race, Any og Catch på en effektiv måte (og også noen vanlige feil man absolutt burde man skal unngå!). Absolutt verd å sjekke ut. 😺
Har du prøvd ut Suspense APIet enda? Mellom Error boundaries og suspenser er det mange states å teste ut. Dette lille trikset hjelper deg med å framprovosere suspense, så du i ro og mak kan flikke på tilstanden til du er fornøyd! 🎨
TIL you can toggle Suspense boundaries in React Dev Tools for easy debugging.
— Delba (@delba_oliveira) January 22, 2023
Useful for making sure your loading skeletons line up with your real content.
h/t @sebmarkbage ✌️ pic.twitter.com/THLBn9Om9t
Aaand that’s that! 👋 Vi sees neste uke!