Pagesmith.ai:n uudelleenrakennus Astrolla: Teknologiavalintamme tuotteen mukaiseksi
Kun perustimme Pagesmithin, markkinointisivustomme oli rakennettu Next.js:llä. Tämä oli käytännöllinen valinta tuolloin — ydinsovelluksemme hyödyntää Next.js-frameworkia, mikä mahdollisti nopean etenemisen yhtenäisellä teknologiapinolla.
Strateginen ristiriita kuitenkin säilyi. Suosittelemme johdonmukaisesti Astroa optimaalisena ratkaisuna markkinointisivustoille ja sisältörikkaalle verkkosisällölle. Jokainen Pagesmithin generoima sivusto hyödyntää Astron suorituskykyyn keskittyvää arkkitehtuuria. Silti oma digitaalinen läsnäolomme nojasi erilaiseen perustaan.
Tänään merkitsemme merkittävän virstanpylvään: pagesmith.ai toimii nyt yksinomaan Astrolla.
Strateginen muutos
Päätös migraatiosta perustui sitoutumiseen tuotteen eheyteen: meidän täytyy harjoittaa sitä, mitä saarnamme.
Arkkitehtuurilliset argumentit, joita esitämme Astron valitsemiseksi React-painotteisten frameworkien sijaan, pätevät yhtä lailla omille laskeutumissivuillemme:
- Markkinointisivut eivät yleensä vaadi monimutkaista asiakaspuolen tilan hallintaa.
- Blogisisältö ei hyödy raskaista hydraatioprosesseista.
- Dokumentaation ei pitäisi luottaa JavaScript-runtime-ympäristöön perusrenderöinnissä.
Jos rakennamme alustaa, joka generoi korkean suorituskyvyn Astro-sivustoja, oman verkkosivustomme täytyy toimia ensisijaisena konseptin todisteena.
Tekninen muutos
Aiempi arkkitehtuuri: Next.js
Vanha asennuksemme hyödynsi Next.js App Routeria. Vaikka se kykenee palvelinpuolen renderöintiin, framework toimittaa väistämättä React-runtimen asiakkaalle mahdollista hydraatiota varten.
<!-- Havainnollistava Next.js-asiakaskuorma -->
<script src="/_next/static/chunks/framework.js"></script>
<script src="/_next/static/chunks/main.js"></script>
<script src="/_next/static/chunks/pages/_app.js"></script>
Tämä arkkitehtuuri tarkoitti, että jokainen sivu sisälsi hydraatio-overheadin riippumatta siitä, sisälsikö sivu interaktiivisia elementtejä.
Uusi arkkitehtuuri: Astro
Uusi “Nolla-JS oletuksena” -lähestymistapamme varmistaa, että toimitamme vain välttämättömän: staattisen HTML:n ja optimoidun CSS:n.
<!-- Astro-asiakaskuorma -->
<!-- JavaScript-paketteja ei ladata oletuksena. -->
Interaktiivisille komponenteille — kuten hinnoittelulaskureille tai demo-lomakkeille — hyödynnämme Astron saariarkkitehtuuria. Tämä mahdollistaa tiettyjen komponenttien hydraation eristyksissä kuormittamatta muuta sivua tarpeettomalla JavaScriptillä.
Suorituskykyvaikutus
Migraatio on tuottanut erinomaisia Core Web Vitals -pisteitä:
| Mittari | Arvo |
|---|---|
| First Contentful Paint | 1,0s |
| Largest Contentful Paint | 1,5s |
| Total Blocking Time | 10ms |
| Cumulative Layout Shift | 0 |
| Speed Index | 1,0s |
10ms estoaikaa. Nolla asettelusiirtymää. Näin käy, kun ei toimiteta tarpeetonta JavaScriptiä.
Periaate on yksinkertainen: Nopein JavaScript on JavaScript, jota ei toimiteta.
Arkkitehtuurilliset erot ja dynaamiset ominaisuudet
On tärkeää huomata, että Pagesmith-sovellus (editori ja kojelauta) pysyy Next.js:ssä. Tämä on harkittu arkkitehtuurillinen päätös. Next.js on suunniteltu ensisijaisesti monimutkaiseen, pitkäkestoiseen tilan hallintaan ja syvään sovellusmaiseen interaktiivisuuteen — sopivaa SaaS-kojelaudalle.
Yleinen väärinkäsitys on kuitenkin, että Astro on vain staattisille sivustoille. Tämä on väärin.
Astro käsittelee dynaamista sisältöä palvelimella yhtä tehokkaasti, mutta ilman asiakaspuolen painoa.
Esimerkiksi uusi hinnoittelusivumme on täysin dynaaminen. Se hyödyntää Astro SSR:ää (Server-Side Rendering) käyttäjän maantieteellisen sijainnin tunnistamiseen reunapalvelimella ja näyttää automaattisesti hinnoittelun sopivassa paikallisessa valuutassa. Tämä tapahtuu välittömästi palvelimella, toimittaen personoidun HTML-sivun käyttäjälle ilman raskasta JavaScript-frameworkia “päättämään” mitä näyttää sivun latautumisen jälkeen.
Käytämme Astroa:
- Älykkäät, reunadynaamiset sivut: Kuten maantieteellisesti tietoinen hinnoittelumme.
- Suorituskykykriittinen markkinointi: Laskeutumissivut, jotka saavat 100/100.
- Sisältörikkaat osiot: Blogit ja dokumentaatio.
Markkinointisivustojen ja modernin verkkosisällön täytyy olla dynaamisia, mutta niiden ei tarvitse olla yksisivuisia sovelluksia (SPA). Ne priorisoivat nopeutta, hakukonenäkyvyyttä ja välitöntä sisällön toimitusta.
Käytä oikeaa työkalua työhön: Next.js raskaalle kojelautatilalle, Astro kaikelle muulle.
”Dogfoodingin” arvo
Oman tuotteemme käyttö sisäisesti altistaa meidät käyttäjäkokemuksen todellisuuksille. Kitkakohdat, jotka saattaisivat jäädä huomaamatta kehityksen aikana, tulevat välittömästi ilmeisiksi, kun luotamme työkaluun omissa liiketoimintaoperaatioissamme.
Markkinointisivustomme ajaminen Astrolla linjaa sisäisen työnkulkumme käyttäjiemme kanssa:
- Kirjoitamme sisältöä standardilla MDX:llä.
- Hyödynnämme samoja komponenttimalleja, joita tekoälymme generoi.
- Kohtaamme samat reunatapaukset ja rajoitukset.
- Koemme suoraan mahdolliset kitkakohdat.
Tämä linjaus varmistaa, että Pagesmithistä viemäsi koodi on tuotantotasoista — koska luotamme siihen oman liiketoimintaläsnäolomme.