Om du er borte fra jobb i en lengre periode, som for eksempel etter en foreldrepermisjon, kan det føles ut som du har gått glipp av alt, og at bransjen har bevegd seg milevis uten deg og du vil slite med å følge med.
Men slik er det i realiteten ikke.
Da en kollega av meg skulle komme tilbake fra permisjon, sa hun at det hadde vært morsomt med en slags oppsummering på hva som har skjedd slik at det var enklere å komme tilbake i det. Det syns jeg var en kjempefin idé, så jeg tok noen minutter til å drodle ned endringer slik jeg husker det fra den siste tiden.
Det kan virke som mye tekst her, men frykt ikke: Det er egentlig ikke så mye endringer som skjer på et år. Det kan føles sånn, men det er bare små ting som gradvis forbedres og utforskes.
Om du har vært borte fra feltet en stund, så har du egentlig ikke gått glipp av mye.
#1: Vercel satser hardt
Vercel er blitt en av de største aktørene innen frontend-utvikling det siste året. Etter nye runder med finansiering har de satset hardt på rekruttering og har tiltrukket seg noen av de største navnene fra Open Source-verden:
- API-lead for React (Sebastian Markbåge)
- Webpack-maintainer (Tobias Koppers)
- Svelte-skaper (Rich Harris)
- Turboprop-skaper (monorepo implementasjon som alternativ til Lerna)
- Og mange, mange flere.
Noe av satsningen rundt Vercel integrerer automatisk bildeoptimalisering via CDN og middlewares til Next.js som kjører på egen infrastruktur som ofte kalles “Edge functions” (se neste avsnitt).
Jørgens spådommer for 2022: - Relasjonsdatabaser vil gjøre comeback!
#2: Cloudflare Workers og Edge Functions
Ofte omtalt som neste generasjon av arkitektur for frontend-utvikling og snakket om som “distributed computing”. I praksis er det små functions (ala Azure Functions, Cloud Functions eller AWS Lambda) som kjører på CDN (the Edge™) og manipulerer HTML output eller request data. Dette koblet gjerne til distribuerte databaser som f.eks Fauna.
Mye brukt for dette er Cloudflare Workers, som Vercel også baserer seg på. Cloudflare Workers kjører V8-motoren og støtter således JavaScript direkte. Men de har også direkte støtte for Web Assembly (WASM) som gir god støtte til ting som Rust og C.
Eksempel på bruk av Cloudflares Workers er Next.js’ nye middlewares. Der kjøres funksjoner på CDN for å manipulere requests mellom generert HTML og klienten. Det gjør at man kan oppnå statisk side generering men samtidig manipulere visning av data per bruker (f.eks innlogging).
Mye snakk om Edge Functions og distributed computing som den moderne arkitekturen. “Running at the edge” er blitt en kjent strofe som refererer til dette.
Lenker:
Nå går Lånekassen over til Kubernetes: - Skal gi kortere vei til produksjon
#3: Next.js er blitt veldig populært
I tråd med satsning fra Vercel er Next.js blitt veldig populært i bruk. De har også kommet med mange nye måter å tenke utvikling av React-applikasjon og nettsider på. Eksempel på dette er middlewares på “the Edge™” som beskrevet i forrige avsnitt.
Men de har også støtte for ulike rendering-typer. Som vanlig serverside rendring, og statisk side generering (SSG). Litt av tilnærmingen til SSG fra Next.js med det de kaller incremental static regeneration gjør at man får SSG men også oppdatering uten bygging. Dette kan være nyttig med bruk av Headless CMS f.eks, hvor du ikke vil bygge ny frontend for hver gang du lagrer nytt innhold. Men de har støtte via Vercel til å generere ny output etter gitt tid. Etter v12.1 har du også mulighet til å generere innhold på nytt fra API (som f.eks kan være integrert med CMS-et ditt).
Populæriteten til Next.js har gjort at Gatsby ikke er mye brukt for nye løsninger. Det har også tatt en del av “markedsandelen” til Create React App.
Derfor dumpet vi BFF-en vår for Next.js
#4: Remix hype
Remix er kommet som et nytt rammeverk på toppen av React. Satser på mye serverside rendring, progressive enhancement og å utnytte nettleseren i større grad. I større grad tradisjonell web som belager seg mye på HTML output og “vanlig nettleser skjema”. Michael Jackson, Ryan Florence (fra react-router og unpkg.com) og Kent C. Dodds som prominente JS-influencers satser veldig hardt på markedsføring og å bruke sin inflytelse til å etablere Remix.
Mange er gira på Remix og det er noe som kan være interessant å følge med på fremover.
Remix er agnostisk til underliggende plattform og kan kjøre på ting som Netlify, Vercel og andre typer plattformer som den tidligere nevnte Clouflare Workers.
Med Remix ser vi også videreføring av trenden rundt mer fokus på ikke client side rendering og til dels ikke static site generation. Mer tilbake til serverside generering, men med en liten twist med edge functions.
Lenker:
State of JS 2021 endelig klar - hvem vinner rammeverk-krigen?
#5: Svelte og Sveltekit blir større
Svelte og Sveltekit er blitt gradvis mer populært og stabilt. Det blir også interessant å se hvordan dette utvikler seg nå som Rich Harris (skaper av Svelte) er blitt ansatt av Vercel. Betyr det mye tettere integrasjon av med Vercel slik vi ser med Next.js?
Sveltekit fortsetter også trenden rundt “tilbakefall” av klientside rendring og single page applications. Nå ser vi at bransjen igjen er blitt moden for å snakke om progressive enhancement og mye av de fordelene nettleseren gir ut av boksen, og fokus på enklere parsing av data (for SEO, skjermlesere, caching osv). Dette har single page application bølgen i stor grad ignorert, men nå har modningen kommet tilbake og fokuset er på rett kjøl.
Lenker:
Svelte vs. Vue i 2022: - Jeg ser ingen fordeler med å velge Svelte over Vue
#6: SolidJS
SolidJS er for mange sett på som interessant alternativ frontendbibliotek.
Mye minner om f.eks React, men har noe annen tilnærming til tilstandshåndtering og reaktivitet.
Lenker:
Hørt om SolidJS? - Kan være verdt en titt!
#7: Typescript
TypeScript kontinuerlig forbedres og utvides med features og støtte. TypeScript har også kommet med et Stage 0 proposal på typer i kommentarer til JavaScripts kjernespråk (eller ECMAScript standarden om du vil).
Et eksempel på ny funksjonalitet i TypeScript er bedre destructurering og if-sjekker på union types av objekter.
Det er generelt helt vanlig nå å bruke TypeScript i prosjekter, og vippepunktet er kommet dit at folk syns det er mer overraskende at det ikke er TypeScript enn motsatt.
Lenker:
- https://devblogs.microsoft.com/typescript/announcing-typescript-4-6/#cfa-destructured-discriminated-unions
- https://github.com/giltayar/proposal-types-as-comments/
Microsoft med typet JavaScript, Twitter ikke overbevist
#8: Byggeverktøy
Byggeverktøy er kanskje det området som har vært i mest bevegelse i det siste. Det er sikkert mange som føler at webpack er moden for en modernisering, og kanskje erstatting. I tillegg til at det er flere abstraksjoner på toppen av webpack (som da NextJS og Create React App) som gjør at færre folk forholder seg direkte til Webpack.
Webpack er fortsatt størst, men ser at det er mye endring og eksperimentering her. Underliggende verktøy som esbuild og swc har noe hype, hvor blant annet Next.js bruker det Rust-skrevet swc som supplement til webpack for hurtighet i bygging.
Vite er kanskje den sterkeste “konsumer”-konkurrenten til webpack. Vite som lagd av Evan You av Vue-fame har vært under aktiv utvikling og har fått en del tracktion og bruk.
Rome som tidligere var ganske hypet tror jeg har sett sin tid på grunn av manglende fokus og ambisjon. De har skrevet om kjernen flere ganger og virker mer interessert i å utforske for egen glede enn å lage produkt for økosystemet. CTO Jamie Kyle har også sluttet i Rome.
Lenker:
- https://github.com/evanw/esbuild — Brukt av blant annet Remix.
- https://swc.rs/ — Skrevet i Rust, brukes underliggende i Next.js sammen med webpack.
- https://rome.tools/#development-status — Tror ikke dette blir noe stort og er for treg i utvikling. De skriver om kjernen rett som det er.
- https://vitejs.dev/ — Skrevet av Evan You fra Vue. Mye økt i populæritet i det siste.
Gaute om Vite: - Lover deg at du ikke går tilbake
#9: State management i React
State management i React har ikke bevegd seg så mye det siste året.
State machines, state charts og implementasjoner som xstate har blitt litt mer snakket om enn tidligere og kan være teknologi som er verdt å undersøke. Men dette er slags eskaleringspunkt dersom man har et problemdomene som krever en del tilstandshåndtering og synkronisering av data.
Bruk av react-query, swr og hooks gjør at egne state management-libraries er unødvendig for mange.
Er det andre ting som har skjedd det siste året som du tenker er verdt å trekke frem? Kanskje teknologi som er på veg frem, eller som har vært mye brukt i prosjektet ditt i det siste med stor hell? Del gjerne erfaringer under!