AI-agenten som sparade nästan två megabyte JavaScript.

En sajt kan bli långsam utan ett enda stort misstag, bara av många små beslut om vad som ska laddas när. Den 28 oktober visade Vercel, företaget bakom ramverket Next.js, hur en AI-agent kan hitta de besluten åt en.

Vad Vercel släppte

I Next.js 16.4 finns en färdighet för AI-agenter som heter next-bundle-optimizer. Den läggs till med ett kommando och körs sedan inifrån agenten. Agenten får tillgång till kartan över hur alla delar av sajtens kod hänger ihop, och letar efter kod som laddas direkt fast den bara behövs senare.

Ett exempel ur Vercels egen text gör det tydligt. En utvecklare har sett till att en tung komponent laddas först när den behövs. Men om någon annan fil i samma paket importerar komponenten på vanligt sätt, laddas koden ändå direkt för alla besökare. För att hitta sådant låter verktyget agenten bygga upp kartan över hur koden hänger ihop och ställa frågor till den.

Agenten letar upp stora grupper av kod som hänger ihop, följer hur de importeras och använder en metod som kallas minimum cut för att hitta ett litet antal importgränser där laddningen av koden kan skjutas upp. Sedan kontrolleras förslaget mot källkoden och mot hur komponenterna faktiskt används på sajten.

Vad agenten hittade

Vercel körde agenten på sina egna sajter v0 och vercel.com. Några av fynden:

• En kodeditor som var på prov laddades på nästan varje sida i v0, också för användare utanför provet. När den bara laddas där den behövs blir de flesta sidor 150 KB lättare.
• Funktioner för en AI-panel laddades i kontrollpanelen på vercel.com även när panelen var stängd. 255 KB mindre på den sidan.
• Kod för att tolka adresser drog med sig en hel motor för att söka i loggar, eftersom båda låg i samma hjälpfil. 125 KB mindre på sidan med driftsättningar.

Sammanlagt sparade agenten nästan två megabyte komprimerat JavaScript, antingen genom att ta bort koden helt eller genom att skjuta upp laddningen tills den behövs.

Varje ändring blev en egen pull request som Vercel provade på en förhandsadress innan den gick live, så agenten föreslår och människor kontrollerar resultatet innan något når besökarna.

Varför det spelar roll för er

Kod som laddas i onödan ska ändå både laddas ner och köras i webbläsaren, och medan det pågår kan en telefon svara sämre på tryck och visa det viktigaste innehållet senare.

Google mäter just det i Core Web Vitals: hur snabbt det viktigaste syns, hur snabbt sidan svarar och om innehållet hoppar när det laddas. Och den som just fått ett samtal från en säljare och kollar upp företaget i mobilen ska helst inte behöva vänta.

Samma arbete på vår egen sajt

Den 9 november gjorde vi samma sorts arbete på insightai.se, med samma arbetssätt: hitta det som laddas för tidigt, flytta det och mäta före och efter. Vi mätte /verktyg/ och startsidan på www.insightai.se före och efter med Googles mätverktyg Lighthouse i mobilläge, tre körningar per sida, och här står medianen.

• På /verktyg/ byggdes 3D-ögat i ett enda tungt steg innan sidan hann svara. Nu byggs det i korta steg efter att sidan ritats. Prestandapoängen gick från 81 till 97, och det största innehållet syns efter 936 millisekunder i stället för 3 377.
• På startsidan hämtades tolv bilder längre ner på sidan samtidigt som startbilden. Nu väntar de tills startbilden är klar. Det största innehållet syns efter 2 191 millisekunder i stället för 3 323.
• När vi mätte hela sajten låg Googles mått för hopp, CLS, över gränsvärdet 0,1 på sju sidor, eftersom texten flyttade sig när typsnitten laddades. Nu har reservtypsnitten en bredd som är uppmätt i webbläsaren mot de riktiga typsnitten, för att texten inte ska flytta sig när typsnittet byts.

Ingen av ändringarna syns för besökaren som något nytt, de ändrar bara när och hur innehållet laddas.

Vad ni kan göra

Mät er egen sajt med Googles PageSpeed Insights i mobilläge och titta på tre siffror: hur snabbt det största innehållet syns, hur länge sidan är upptagen och hur mycket den hoppar. Är någon av dem röd kan kod som laddas för tidigt vara en av orsakerna, men även bilder, typsnitt och serverns svarstid spelar in. Vill ni att vi tittar på det, boka en gratis analys.

Källor

• Next.js, 28 oktober 2026: Ship less JavaScript in Next.js with your AI agent