Dette var uka for knask 🍬, knep 👻, eller begge deler 🎃.
Og 9 254 ting skjedde i React-verdenen!
React Conf 2019 pt. 2
React Conf har kommet og gått, nye API-er har blitt sluppet i eksperimentell versjon, og konferansedeltakerne er tilbake på arbeidsbenken og prøver ut det nye de har lært fra årets konferanse. Nå har også alle talks fra konferansen blitt redigert og lastet opp på Youtube i separate videoer slik at du slipper å spole deg gjennom 8/9-timers lange uredigerte livestreams for å se talkene du er aller mest interessert i.
Av årets talks kan jeg personlig anbefale Sophie Alperts fantastiske livekoding av en enkel React-renderer som viser hvor enkelt det kan være å skrive din helt egne custom renderer for React. Talken gir også et lite innblikk i hvordan koden i React og ReactDOM henger sammen om du er interessert i å grave litt dypere der eller bidra til utviklingen på Github.
Jenn Creighton bidro også med en knallgod talk om komponentdesign og hvilke teknikker fra skjønnlitteratur man kan dra nytte av for å skrive mer deklarativ kode og unngå unødvendig og for tidlig abstrahering av komponenter. Anbefales!
9 høydepunkter fra React Conf 2019
Kristofer Giltvedt Selbekk tar oss med til Nevada, hvor årets største React-nyheter ble vist fram.
Formik 2.0 er ute! 🎉
Verdens mest populære open source skjemabibliotek for React, Formik, er nå offisielt ute i versjon 2.0. Den største nyheten i denne releasen er kanskje at biblioteket nå har støtte for hooks for generelle use-cases. Hooken useFormik har vært tilgjengelig en liten stund nå, men har et veldig begrenset bruksområde og er noe du mest sannsynlig ikke vil komme til å røre når du bygger dine egne skjemaer (med mindre du heter Jared Palmer).
De nye hookene er useField, som lar deg erstatte <Field />-komponenten med dine egne hjemmelagde inputkomponenter, og useFormikContext, som endelig lar deg luke ut alle call til høyere-ordens-komponenten connect. Det er ikke noe galt med HOCs per se, men vit at Dan Abramov feller en tåre hver gang du bruker en HOC fremfor en hook i dine funksjonelle komponenter 😢.
Full changelog finner du her.
Et lettvektsalternativ til Formik er nykommeren React Hook Form. Bundlestørrelsen til React Hook Form er på nesten en tredjedel av Formik, som er henholdsvis 5,3 kB og 14,4 kB gzipped. React Hook form har heller ingen tredjepartsavhengigheter, men har ikke støtte for klassekomponenter om du jobber med kodebaser som trenger det. DEV-bruker Brian Neville-O’Neill har skrevet en fin artikkel som sammenligner de to bibliotekene om du er interessert i å finne ut mer.
Hemmelighetene bak dartspillet på Oche
- Ingen grunn til å finne opp kruttet på nytt, sier dart-utvikler Shako Farhad.
Lynraske virtuelle lister ⚡️
react-beautiful-dnd er et populært bibliotek for å lage lister med støtte for drag-and-drop. Biblioteket er nå ute i versjon 12.0 og har med det endelig fått støtte for virtuelle lister, noe som gir enormt god ytelse ved lister med mange elementer. Ytelsen til vanlige lister påvirkes av totalt antall elementer i listen, mens virtuelle lister (stort sett) bare påvirkes av antall synlige elementer. Folka bak biblioteket påstår at du får 60 fps ved lister med 10000 elementer, noe du selv kan teste her.
En annen minst like stilig nyhet i 12.0 er det nye sensor-apiet som lar deg lage dine egne kontrollere for å håndtere drag-and-drop med absolutt hvilken som helst slags type input. Enten du vil manipulere lister med PS4-kontrolleren din eller ved å late som du er Tony Stark mens du veiver hendene foran webkameraet ditt er det ikke noe problem, så lenge du lager en integrasjon (eller bruker en eksisterende) mot sensor-apiet.
Changelogen finner du her.
Burde du bry deg om Concurrent Mode? 🤔
Harry Wolff har skrevet en knallgod oppsummering om fordelene ved det etterlengtede tilskuddet til React, Concurrent Mode, som ble sluppet i eksperimentell versjon under årets React Conf.
«Det kommer litt an på.»
Her forklarer han hva Concurrent Mode er, hvilke muligheter det gir deg for å kontrollere renderingen av applikasjonen din, og hvordan det løser problemer som tidligere har vært vanskelig å løse på en god måte.
Men trenger du egentlig å bry deg om eller bruke Concurrent Mode? Svaret fra Wolff er det samme du ville fått om du stilte det samme spørsmålet om annen avansert funksjonalitet ved React: nei? Det kommer litt an på. Concurrent Mode er ikke noe de fleste trenger, men en nice-to-have som løser et spesifikt problem på en elegant måte.
Ukas podcast 🎧
Ukas React-podcast er den første av seks i en serie om React Conf 2019. Ut i ilden denne uka er Andrew Clark som snakker om blant annet utviklingen av Concurrent Mode, omskrivingen av React Fiber, og Suspense.
Det var det for denne gang. Vi ses <NesteUke />!
Yr: - Cache er alfa og omega for oss
Slik takler Yr 11 millioner unike brukere på én uke, og enorme datamengder om all verdens vær.