Sito veloce nonostante social plugin e javascript, come fare?

[van.basten]

Sito veloce nonostante social plugin e javascript, come fare?

Salve,
da tempo cerco di progettare e costruire siti web il più veloci possibili seguendo quasi tutti gli accorgimenti possibili, in alcuni casi sono riuscito ad ottenere ottimi risultati in altri il risultato è stato veramente scarso.

Tra questi ci sono alcuni portali web che fanno un largo uso di quelli che io definisco script esterni, tanto per citarne qualcuno:

• Pulsante Mi Piace Facebook
• Modulo commenti Facebook
• Pulsante tweet di Twitter
• Badge Google+
• Pulsante +1 di Google+
• Google Analytics
• Google Adsense
• Google AdPlanner

e forse anche qualche altro componente.

La domanda chiave è, come ridurre l'incidenza di questi script nel caricamento del sito web?

[juanin]

Diciamo che utilizzando gli script asincroni l'impatto è sul tempo complessivo, ma non su quello percepito.
La soluzione migliore oltre ad usare i codici asincroni è di fare defer degli script.

[van.basten]

Grazie, per il defer devo usare la dicitura <script defer oppure ```
<script defer="defer"

[juanin]

Usare lo script defer funziona solamente per gli script non inline.

Quello che puoi fare è far caricare gli script dopo il caricamento completo della pagina oppure all'on scroll.

Le soluzioni sono molte e comunque in linea di principio utilizzando gli script asincroni dei vari social non dovresti avere impatto sul tempo di inizio rendering.

Ad esempio qui sul forum i bottoni social vengono caricati solamente dopo lo scroll in basso a destra.

[juanin]

È appena uscito un articolo dedicato a questa discussione

http://seoblog.giorgiotave.it/ottimizzare-velocita-caricamento-social-widgets/3661

A cura di Ayrton2001

[teccak]

ottimo articolo

a mio parere la soluzione + semplice su siti wordpress è utilizzando il plugin lazy load

ignoro invece perchè non esistano plugin validi per utilizzare la versione asincrona degli script dei social

[Lazzo85s]

Ciao.
Sto facendo un restyling di un sito fatto in HTML4, che voglio trasformare tutto in HTML5.
Ho letto quindi con molto interesse questa discussione e applicando anche alcune tecniche descritte nel relativo articolo sul seoblog.

Durante le mie "ricerche" per migliorare e approfondire la questione della velocità di caricamento delle pagine, mi sono imbattuto negli attributi ASYNC e DEFER per l'HTML5.
In particolare in questa pagina:
http://msdn.microsoft.com/it-it/library/ie/hh673524(v=vs.85).aspx

Ciò che non capisco è se quegli attributi svolgono sostanzialmente la stessa cosa dei metodo descritti nell'articolo;
se si, cosa mi conviene usare?
Inoltre non mi è nemmeno ben chiaro se sono supportati da tutti i browser.

[juanin]

Sì quelli in teoria dovrebbero fare alcune delle cose descritte dall'articolo...solo che attualmente non sono supportati da tutti i browser purtroppo.

[Lazzo85s]

Usando ASYNC e DEFER ci sono "controindicazioni"?
Come si comportano i browser che non li supportano? Li ignorano?

[juanin]

I browser che non li supportano li ignorano sì.