Animasjoner som skader brukeropplevelsen, VG-valg med Astro, Sanity redder Styled Components og de 100 ferskeste tingene i CSS, i ukens Forrige uke!

Biblioteker som Framer Motion gjør det enkelt å lage fine animasjoner. Men ikke overdriv, skriver Jon Johansen i Bekk.
📸: Bekk

ForrigeUke er en artikkelserie som oppsummerer hva som skjedde i frontend-verden i uka som var. Innleggene skrives av frontend-faggruppene til Bekk, og kan også følges på bekk.no/fag.

Dette var uken for å finne veien til prod 🚂 og å miste nye gadgets 🏴 — Og 2 815 ting skjedde i frontend-verdenen!

Kan vi droppe animasjoner nå? 🙅♂️

Animasjoner kan gi en følelse av et skikkelig finpolert grensesnitt, og personlig noe jeg bruker uforholdsmessig mye tid på når det jeg vil at nettsiden har det lille ekstra ✨. Moro som det er, kan det bli for mye av det gode.

I denne artikkelen skriver Emil Kowalski fra Linear om hvilke intensjoner som bør ligge bak animasjoner, og hvorfor noen animasjoner rett å slett er unødvendig og skader brukeropplevelsen 💀.

Med på lasset får man særdeles gode og interaktive eksempler som forklarer forskjellige typer animasjoner, og når man må bruke de. Rett og slett moro lesing!

Sjekk den ut her: You Don’t Need Animations

Styled-components får uventet drahjelp 🚀

Som vi var innom i mars, annonserte CSS-in-js-biblioteket Styled-components at de gikk over i vedlikeholdsmodus og lite nytt kom til å bli annonsert. 

Det er ikke like enkelt for alle å røske ut avhengigheten til Styled-component og skrive om til et annen styling. Det har lenge vært kjent at CSS-in-js har hatt litt medium-minus ytelse. Det kom en løsning for dette i react 18 med useInsertionEffect, men Styled-components tok aldri denne i bruk 😿.

Løsningen for Sanity som fortsatt er avhengige, ble å forke biblioteket og ta en aldri så liten opprydding. Resultatet ble en overraskende optimalisering på 40% ytelse.

Du kan lese litt om hvordan de gikk frem her 👇

De 100 ferskeste tingene i CSS 🆕

Det dukker opp nye kule ting i CSS-speccen stadig vekk, og det er ikke bare-bare å holde tritt der. 

Enda verre er det når det tar litt tid for at støtte blir adoptert i de forskjellige browserene og at det er trygt å ta i bruk i produksjon. Personlig fører det til at jeg ofte glemmer litt av de nyere tingene før jeg har muligheten til å ta de i bruk.

Heldigvis for oss har Adam Argyle skrevet en liste med hva som er nytt (og kult) de siste 5 årene, så her kan man hente seg inn. Alt fra syntax, selectorer, funksjoner, properties og en myriade av enheter som man nå kan ta i bruk. 

Absolutt verdt å ta en gjennomscrolling og se om det er noe man ikke har fått med seg, eller friske opp hukommelsen litt 🧠.

Astro skryter av valgdeltakelse 🗳️

Det er ikke hver dag et av de største frontend-rammeverkene skryter på internett av å være i bruk i Norge. Men her react-rammeverket Astro ute å peker på at VGs valgnettside er bygget i Astro, etter at den hadde utfordringer i ved tidligere valg.

Moro!

Aaand that’s that! 👋 Vi sees neste uke!