Hopp til hovedinnhold

<ForrigeUke uke=”14" år=”2024" />

Publisert:12. april 2024
Skrevet av:Jon Johansen

Dette var uken for å runde et kvartal av året 📊 og debugging-hjelp fra Copilot 🤖Og 479 ting skjedde i frontend-verdenen!

«<ForrigeUke /> er en artikkelserie som oppsummerer hva som skjedde i frontend-verden i uken som var.»
Bilde av Denisa V. på Unsplash

Forslag om signaler til JavaScript 🚦

I uken som gikk har det dukket opp et offisielt forslag fra TC39-gjengen for Signals i JavaScript, med innspill fra maintainere fra omtrent alle frontend-bibliotekene. ✨

Signaler er en måte å jobbe reaktivt i JavaScript, og har tidligere vært tilgjengelig i litt forskjellige varianter fra ulike biblioteker. Nå er målet altså å standardisere dette.

I dette eksemplet med en enkel teller kan man se hvordan man tradisjonelt har gått frem for å oppdaterere grensenitt med JavaScript (Det er omtrent sånn det skjer i kjernen av en del av frontend-bibliotekene man bruker idag), og hvordan man løser det ganske mye enklere og penere med Signals 💅 .

Nyheter fra VsCode 🆕

Den månedlige oppdatering av VsCode (Mars-releasen) kom forrige uke. Med i den nye versjonen er det ganske mye snacks.

Favoritten så langt er muligheten til å gi egne navn til tabber, som har vært etterlengtet når du jobber med flere filer med samme navn (Next.js App-router 👀) . Men også muligheten for å restarte extensions, låse scrolling mellom to tabber og muligheten for å legge til “headere” i kommentarer som dukker opp i minimappet på siden 🗺 !

Og på tampen, et lite bonus-tips fra VSCode 🔥

Eksternt innholdVideo av Terminalen i VsCode som flyter over sidebaren

Tips for bedre bildebruk på Web 🖼

Sentry kom med en artikkel for å forbedre bildebruken på Web, med kjempefine forklaringer på hvordan de forskjellige grepene man kan ta påvirker. Kortversjonen er:

  • Bruk riktig bildeformat (AVIF og WebP)
  • Ha riktig størrelse på bildene man bruker ( <Picture> — taggen med srcset)
  • Lazy loading av bilder (bruk av loading-attributtet)
blog.sentry.io

Low effort image optimization tips

Boost your site's speed with our guide on optimizing images. Learn about using AVIF, WebP, lazy loading, and more for faster, efficient ...

Guide til render optimalisering i React Query

For de som bruker useQuery i frontenden sin, har det denne uken dukket opp en bloggpost som forteller litt om hvordan man kan optimalisere rendering. Her med objekt-referanser, å følge med på spesifikke properties og memoisering.

For tipsene i detalj, kan du sjekke ut posten her 👇

tanstack.com

Render Optimizations | TanStack Query React Docs

React Query applies a couple of optimizations automatically to ensure that your components only re-render when they actually need to. This ...

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

Skrevet av