Skrev om Vivaldi med React-portaler: – Ga mye bedre ytelse!

Den norske Vivaldi-nettleseren skal ha blitt mye raskere, takket være portaler i React.

Åpning av nye nettleservinduer er noe av det som skal gå raskere, takket være portaler i React. Vivaldi-sjef Jon von Tetzchner sier prosjektet har vært svært omfattende. 📸: Vivaldi
Åpning av nye nettleservinduer er noe av det som skal gå raskere, takket være portaler i React. Vivaldi-sjef Jon von Tetzchner sier prosjektet har vært svært omfattende. 📸: Vivaldi Vis mer

Nettleseren Vivaldi har kommet i en ny versjon som ifølge selskapet har gjennomgått en "massiv kode-refaktorering".

Ved å skrive om mye av koden, skal spesielt åpning av nye nettleservinduer ha blitt mye raskere enn før.

– Ved å rendre nettleservinduer gjennom React-portaler har vi åpnet for nye muligheter, redusert minnebruk og økt den totale ytelsen vesentlig, opplyser selskapet.

React-portaler

Kodebasen til Vivaldi ble påbegynt i 2013 og selskapet bruker React til å lage brukergrensesnittet.

I den nye 6.2-versjonen har Vivaldi tatt i bruk det de kaller Portal Windows, som igjen baserer seg på portaler i React. Prosjektet med å lage "Portal Windows"-teknologien skal ha vært temmelig omfattende og pågått over flere år.

For de som ikke kjenner til portaler i React, så er det en løsning som gjør det mulig å rendre children et helt annet sted i DOM-en enn der de normalt ville blitt rendret. Med Reacts createPortal() kan du rendre for eksempel en modal rett etter body – slik at modalen kan dukke opp over resten av siden:

import { createPortal } from 'react-dom';

// ...

<div>
  <p>This child is placed in the parent div.</p>
  {createPortal(
    <p>This child is placed in the document body.</p>,
    document.body
  )}
</div>

React-portaler endrer med andre ord plasseringen av DOM-noden.

I versjon 6.2 av Vivaldi brukes denne teknikken for å endre hvordan nettleseren håndterer mange vinduer.

Bedre brukergrensesnitt

Vivaldi-utvikler André Schultz er en av dem som har jobbet mye med prosjektet, og sier i lanseringsbloggposten:

– Portal Windows har en ny arkitektur med ett UI-dokument, i motsetning til den gamle måten der hvert vindu hadde et separat dokument.

Han forklarer at dette krevde en omfattende refaktorering.

Med Portal Windows har Vivaldi kunnet gjøre forbedringer i brukergrensesnittet, blant annet i nettleserens såkalte Windows Panel som nå kan brukes til å holde styr på fanene i mange ulike nettleservinduer – ikke bare ett. Dermed får du alt på ett sted.

Portal-teknologien gjør også at de plagsomme popup-vinduene som enkelte nettsteder viser vil dukke opp og forsvinne igjen raskere.

37 prosent raskere

Ifølge Vivaldis egne tester skal Vivaldi 6.2 være 37 prosent raskere på å åpne nye nettleservinduer, sammenlignet med forrige versjon.

Sammenlignet med en eldre 2018-versjon av nettleseren, er ytelsesforbedringen 64 prosent. Testene er gjort på en PC med 2 GHz Intel Core i3-prosessor.

Vivaldi-sjef Jon von Tetzchner sier Portal-prosjektet har vært en enorm jobb.

– Fremover vil portal-arbeidet åpne for mange muligheter og mer fleksibilitet, sier Tetzchner.

Vivaldi 6.2 inneholder også en del andre nyheter, som blant annet at du nå kan prioritere rekkefølgen på forslagene som kommer opp når du bruker adressefeltet til å søke i. Du kan for eksempel velge å prioritere bokmerker, historikk, nettleserlogg eller søk.