Hej Aminoer. Jeg har siddet og rodet lidt med PageSpeed Insight, og fået flyttet vores site op fra 30/100 til 80/100, altså ved at plukke alt det lavt hængende frugt. Nu er der lidt længere op til grenene med frugt på, men siden dette punkt er dårlig for både min mobil visning og desktop visningen, tænkte jeg at det ville jeg også gerne have væk. Dette står under den ubehjælpelige overskrift: Your page has 2 blocking CSS resources. This causes a delay in rendering your page. None of the above-the-fold content on your page could be rendered without waiting for the following resources to load. Try to defer or asynchronously load blocking resources, or inline the critical portions of those resources directly in the HTML. Optimize CSS Delivery of the following:
Jeg kører med en 1.6.1.4 Prestashop, med standard theme (dog tilpasset en del)
Så er der nogle der har et bud på, hvad der skal til for at løse dette problem ? |
Eliminate render-blocking JavaScript and CSS in above-the-fold content - ja men, hvad betyder det.
- 1
statikKen trækker en del så slå en af dem fra faktiske trækker begge 2 en del men det er nok kun nødvendigt med den ene http://static.zotabox.com/ fra eller http://www.google-analytics.com/ det vil få pagescore bedre , at fjerne begge 2 vil den blive det aller bedst men det er jo også dejligt kunne se hvor trafik kommer fra billeder er store stadigvæk de burde kunne gøres mindre jeg har lært med Wordpress der er stor forskel på facebook plug in hvor meget cpu de trækker måske findes et bedre til din prestashop |
poledancer.dk klik bestil shows altid god priser og lange shows
slå optimering til at CSS i indstillinger og så løfter den dig lidt mere |
Det betyder at pga. du har 2 CSS stylesheets øverst på din side (hvliket er meget normalt), skal browseren hente de 2 stylesheets inden den kan forsætte med at indlæse resten af siden. Dvs. når den når til de 2 linjer i HTML koden, skal filerne hentes inden den indlæser de efterfølgende linjer. Og det skaber så en lille (typisk marginal) forsinkelse i hastigheden. Den måde du kan løse det på, er at skrive 'async' inde i CSS linjen. F.eks.: <link rel="stylesheet" href="http://festbyen.dk/themes/default-bootstrap/cache/v_115_219147e0229e0e16e01ba206b69f3fad_all.css" type="text/css" media="screen"/> ændre til: <link rel="stylesheet" href="http://festbyen.dk/themes/default-bootstrap/cache/v_115_219147e0229e0e16e01ba206b69f3fad_all.css" type="text/css" media="screen" async /> Det vil gøre, at den henter dem asynkront i stedet. Eller du kan lave din CSS inline, så det ikke ligger i en ekstern fil (dog ikke specielt nemt med din Google font). Du kan også flytte dem fra <head> nederst på siden lige før </body> Det er dog ikke noget jeg vil anbefale at du bruger tid på. Hvis du laver CSS styles non-blocking, vil du opleve dit website først bliver vist uden design/korrekt font, og det så vil blinke til det rigtige design efter siden er indlæst. Fordi stylesheets ikke nødvendigvis bliver indlæst samtidigt med resten af siden. Det er ikke særlig kønt. |
Jeg forstår godt problemstillingen, Det jeg ikke helt forstår, er lige præcis, hvor disse CSS filer bliver kaldt, og hvordan jeg kan ændre det. Det ene filnavn giver mig det indtryk at det er noget cache, der alligevel bliver ændret konstant. Kan i ser hvor Prestashop gør brug at disse css'er I forhold til google API'en, er det så analytics der giver dette resultat ? |
Compack pluk og pak lagerhotel
Brug tiden på at udvikle din webshop i stedet for at have eget lager
Kan man ikke, det er kun javascripts dette gøres ved.
Det kommer nu an på hvordan man laver det. Man loader selvfølgelig det der skal bruges above the fold i selve html dokumentet med indlejret css i head. Så vil den ikke blinke. |
Ekspert i hastighedsoptimering og Teknisk SEO
Optimering og udvikling af hurtige hjemmesider, med mere end 25 års erfaring. Danmarks bedste hastighedsoptimering med speciale i wordpress. Wordpress hjemmeside