Animasjoner som skader brukeropplevelsen, VG-valg med Astro, Sanity redder Styled Components og de 100 ferskeste tingene i CSS, i ukens Forrige uke!<\/p>\n
\n Biblioteker som Framer Motion gj\u00f8r det enkelt \u00e5 lage fine animasjoner. Men ikke overdriv, skriver Jon Johansen i Bekk.
\n \ud83d\udcf8: Bekk\n <\/p>\n
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\u00e5 f\u00f8lges p\u00e5\u00a0bekk.no\/fag<\/a>.<\/p>\n Dette var uken for \u00e5\u00a0finne veien til prod \ud83d\ude82<\/a>\u00a0og\u00a0\u00e5 miste nye gadgets \ud83c\udff4<\/a>\u00a0\u2014\u00a0Og 2 815 ting skjedde i frontend-verdenen!<\/p>\n Kan vi droppe animasjoner n\u00e5? \ud83d\ude45\u2642\ufe0f<\/p>\n Animasjoner kan gi en f\u00f8lelse av et skikkelig finpolert grensesnitt, og personlig noe jeg bruker uforholdsmessig mye tid p\u00e5 n\u00e5r det jeg vil at nettsiden har\u00a0det lille ekstra\u00a0\u2728. Moro som det er, kan det bli for mye av det gode.<\/p>\n I denne artikkelen<\/a> skriver Emil Kowalski fra Linear om hvilke\u00a0intensjoner\u00a0som b\u00f8r ligge bak animasjoner, og hvorfor noen animasjoner rett \u00e5 slett er un\u00f8dvendig og skader brukeropplevelsen \ud83d\udc80.<\/p>\n Med p\u00e5 lasset f\u00e5r man s\u00e6rdeles gode og interaktive eksempler som forklarer forskjellige typer animasjoner, og n\u00e5r man m\u00e5 bruke de. Rett og slett moro lesing!<\/p>\n Sjekk den ut her: You Don’t Need Animations<\/a><\/p>\n Styled-components f\u00e5r uventet drahjelp \ud83d\ude80<\/p>\n Som\u00a0vi var innom i mars<\/a>, annonserte CSS-in-js-biblioteket Styled-components at de gikk over i vedlikeholdsmodus og lite nytt kom til \u00e5 bli annonsert.\u00a0<\/p>\n Det er ikke like enkelt for alle \u00e5 r\u00f8ske ut avhengigheten til Styled-component og skrive om til et annen styling. Det har lenge v\u00e6rt kjent at CSS-in-js har hatt litt medium-minus\u00a0ytelse.\u00a0Det kom en l\u00f8sning for dette i react 18 med\u00a0useInsertionEffect<\/a>, men Styled-components tok aldri denne i bruk \ud83d\ude3f.<\/p>\n L\u00f8sningen for Sanity som fortsatt er avhengige, ble \u00e5 forke biblioteket og ta en aldri s\u00e5 liten opprydding. Resultatet ble en overraskende optimalisering p\u00e5 40% ytelse.<\/p>\n <\/p>\n Gir nytt liv til d\u00f8de styled-components<\/p>\n \n \u2013 Ikke bruk det til nye prosjekter, sa styled-components-skaperen f\u00f8r sommeren. Da m\u00e5tte norske Sanity ta grep.\n<\/p>\n <\/a><\/p>\n Du kan lese litt om hvordan de gikk frem her \ud83d\udc47<\/p>\n De 100 ferskeste tingene i CSS \ud83c\udd95<\/p>\n Det dukker opp nye kule ting i CSS-speccen stadig vekk, og det er ikke bare-bare \u00e5 holde tritt der.\u00a0<\/p>\n Enda verre er det n\u00e5r det tar litt tid for at st\u00f8tte blir adoptert i de forskjellige browserene og at det er trygt \u00e5 ta i bruk i produksjon. Personlig f\u00f8rer det til at jeg ofte glemmer litt av de nyere tingene f\u00f8r jeg har muligheten til \u00e5 ta de i bruk.<\/p>\n Heldigvis for oss har Adam Argyle skrevet en liste med hva som er nytt<\/a> (og kult) de siste 5 \u00e5rene, s\u00e5 her kan man hente seg inn. Alt fra syntax, selectorer, funksjoner, properties og en myriade av enheter som man n\u00e5 kan ta i bruk.\u00a0<\/p>\n Absolutt verdt \u00e5 ta en gjennomscrolling og se om det er noe man ikke har f\u00e5tt med seg, eller friske opp hukommelsen litt \ud83e\udde0.<\/p>\n Astro skryter av valgdeltakelse \ud83d\uddf3\ufe0f<\/p>\n Det er ikke hver dag et av de st\u00f8rste frontend-rammeverkene skryter p\u00e5 internett av \u00e5 v\u00e6re i bruk i Norge. Men her react-rammeverket Astro ute \u00e5 peker p\u00e5 at VGs\u00a0valgnettside<\/a>\u00a0er bygget i Astro, etter at den hadde utfordringer i ved tidligere valg.<\/p>\n Moro!<\/p>\n Aaand that\u2019s that! \ud83d\udc4b Vi sees neste uke!<\/p>\n