Nurga universaalne vs Prerender.io

Kui olete nurga arendaja, siis teate, et SEO on karvane olukord. Ja kui te olete nagu meie, siis otsis Google tõenäoliselt teid kahe peamise lahenduse leidmiseks. Selles artiklis tahame selle jaotada, kui keeruline on iga protsess ja kui tõhus see on. Pange tähele, et see kõik põhineb meie kogemustel. Kui arvate teisiti, võtke julgelt ühendust!

1. Nurga universaalne

Dokumentatsioon: https://angular.io/guide/universal
Keerukus: 7/10
Tõhusus: 6/10

Meie kasutuses ei kasutanud me nurk-universaalset starterit. Olime oma veebisaidi juba ilma üheta üles ehitanud (projekt Nurga 7). Ja kuigi protsess ei ole teie olemasolevasse nurgaprojekti integreerimiseks ülipikk, võtab toimuva mõistmine kindlasti aega. Selgituse tuhmiks loob Angular Universal teie rakendusest kaks versiooni. Üks, mis on serveri rakendus, mis muudab teie lehed staatilisteks HTML-ideks. See juhtub kõigepealt ja sellest tõmbuvad SEO robotid. Teine versioon on rakendus „brauser”. See on teie tavaline dünaamiline ja täielikult funktsionaalne nurgarakendus. Universal vahetab teie serveripõhise rakenduse koos brauserirakendusega välja pärast laadimise lõpetamist. Nii võite näha kerget värinat, eriti väiksema kiiruse korral.

Kuna see on artikkel peamiselt selle kohta, miks üksteist kasutada, ei kirjuta me liiga palju koodi välja. Vaadake üle ülaltoodud dokumentide link.

Siiski tahame kommenteerida probleeme, millega silmitsi seisime, ja asju, mida pidime nende lahendamiseks tegema:
1. Lisage oma paketti.json skriptid, mida doc teile soovitab. Selle sisestamisel nurga.jsoni serveri sihtmärki kuvatakse tõrge.
2. Kui soovite oma AppServerModuleNgFactory importimisel oma server.ts faili hankida, siis faili './dist/server/main', mitte faili './dist/server/main.bundle'
3. Kui kasutate oma projekti jaoks SCSS-i, lisage see fragment kindlasti nurga all.json serveri sihtmärgi alla. Vastasel juhul viskaks see serveri sihtmärgi loomisel vigu.

"stylePreprocessorOptions": {“includePaths”: [“src / scss”]}

4. Kontrollige kindlasti ka väljundteid tavalise ehituse ja serveri sihtmärkide jaoks. Ehituse väljundtee peaks olema nagu dist / projekti nimi / brauser ja serveri väljundi tee peaks olema nagu dist / projekti nimi / server

Pärast töö lõpetamist nägime kõiki meie lehe koode kroomitud lehe „Vaata lehe allikat” all. Samuti integreerime oma projekti sisse dünaamilised metasildid (kasutades metateenust) ja näeme neid oma lehte kontrollides. Nüüd on siin plussid ja miinused pärast meie saidi juurutamist ja meie lehtede Google'is indekseerimist:

Plussid
- Kõik meie lehed olid Google'is otsitavad
- Google'i robotid tõmbasid teksti meie lehtedelt edukalt kaasa

Miinused
- Google'i robotitega tõmmatud tekst oli meie lehtede juhuslik tekst (nagu linkide nimed, jaluses olevad asjad, piltide altkirjeldused, kehatekst jne)
- Kui proovite teenindada kohandatud ekspressmarsruute, siis satuvad teid hätta. Koefitsiendid on see, et teil on parem oma kohandatud marsruutide jaoks mõni teine ​​serveri eksemplar üles kerida.

2. Prerender.io

Dokumentatsioon: https://prerender.io/documentation
Keerukus: 2/10
Tõhusus: 7/10

Enne kui proovisime Angular Universalit, proovisime Prerender.io. See on kindlasti marsruut, kus on kõige vähem vaeva. Selle rakendamiseks viisil, mis töötab koos Google'i ja Bingi robotitega, oli vaja vaid mitut koodirida ja nende saidil märgi registreerimist. Ja selles näites kasutame Express Node serverit:

var prerender = nõuda ('prerender-node'). set ('prerenderToken', 'YOUR_TOKEN');
prerender.crawlerUserAgents.push ('googlebot');
prerender.crawlerUserAgents.push ('bingbot');
prerender.crawlerUserAgents.push ('yandex');
app.use (prerender);

Kui kasutate Express / Node, veenduge, et ekspress.staatilise vahetarkvara kohal oleks rakendus app.use (prerender), mis võib teie dist-kataloogi teenindada.

Prerender.io abil teeb see põhimõtteliselt sama asja universaalsega. Vahemällu salvestatakse teie lehtede staatiline html ja kuvatakse need kuni Google'i robotiteni, kui nad teie saidil läbi indekseerivad.

Nii et see on ülilihtne ja sobib hästi ka SPA-dega, kuid kas see oli efektiivne?

Plussid
- Väga kiire seadistamine
- tasuta versioon võib vahemällu salvestada kuni 250 lehekülge
- Meie lehtede google'i otsingutulemid vastavad kõik kirjeldusele, mille me metateenuses seadsime

Miinused
- Nii palju kui 250 tasuta lehte kõlab, võib teie URL-i mitme versiooni vahemällu salvestada (kasutades näiteks meie saiti) https://www.brewcrewlabs.com ja https://brewcrewlabs.com. Järgmine määramistasand on 20 000 lehekülge hinnaga 15 dollarit kuus.

3. Kohtuotsus

Otsus on see, et Nurga universaalne pole lihtsalt veel valmis. Ehkki võib olla asju, mida võiksime oma SEO täiustamiseks uurida, on Prerender.io lihtsalt lihtsam ja tõhusam. Kui te ei mõtle iga nädal arvukalt lehti toota, võib Prerender.io olla teile lahendus. Ehkki Nurga universaal töötab mõnes mõttes, nõuab see Prerender.io-ga samal tasemel töötamiseks palju rohkem jalgade tööd. Võib-olla ei tea me lihtsalt Angular Universalile salajast kastet - kui te seda teete, palun andke meile oma kogemusest teada!

Loodetavasti aitas see artikkel kedagi teist sarnases olukorras!