Optimaliseren van paginagrootte voor Shopify-ongemakkelijke waarheden

De ongemakkelijke waarheid in mijn geval is dat onze hoofdpagina momenteel 3,4 MB weegt - en dit is alleen nog maar de HTML.

Ik had te veel vertrouwen in de ontwikkelaars van het thema - we gebruiken een thema genaamd "Fastor" door Roarthemes.

Helaas is er een slechte ontwerpkeuze gemaakt in dit thema; of misschien is het standaard Shopify gedrag (op zoek naar iemand om de schuld te geven, natuurlijk ...).

In elk geval zijn voor elk product alle gegevens, inclusief de artikelbeschrijving, opgenomen. We hebben sliders, die veel verschillende producten op onze pagina laten zien.

Zo vermenigvuldigt de grootte zich.

De dader

De code ziet er zo uit, voor elk product:

window.products.id1302097199206 = {“id”:1302097199206,”title”:”OpenDrop V2″,”handle”:”opendrop-v2″,”beschrijving"Dit is de OpenDrop v2, experimenteel platform voor digitale microfluïdica.

De volledige beschrijving is inbegrepen. Voor elk product dat gelinkt is op de hoofdsite. En dat is veel. Heel veel tekst.

Dit wordt als volgt gegenereerd:

{{product | json}}

en de volgende bestanden van Roartheme Fastor zijn er relevant voor:

Je hebt meestal niet de hele artikelomschrijving nodig in een pagina die naar het artikel linkt, toch? Het wordt niet gebruikt in de frontend.

Helaas ondersteunt Liquid, de Shopify templating engine, geen regex.

Bevestiging van

mijn huidige suggestie is om de volledige regel te verwijderen in alle bovengenoemde sjablonen (maar NIET de JS bestanden of de js.liquid bestanden - het is daar niet nodig!).

Dit heeft de HTML-grootte van onze voorpagina teruggebracht tot 1,8 MB. Nog steeds veel. We gaan overschakelen naar een ander thema, dit zal in de tussentijd dienen.

De functionaliteit is een beetje verminderd - in de voorbeeldvensters kun je nu niet meer alle foto's bekijken. Wat maakt het uit. U kunt nog steeds doorklikken naar het product en het bekijken.

De productpagina's zelf worden, voor zover ik kan zien, hierdoor op geen enkele manier veranderd.

Maar ga op eigen risico verder.