Retardez JS pour optimiser les Core Web Vitals et les faibles performances des campagnes Facebook ADS. - ūüŹÜ Serveur g√©r√©
8 juillet 2022

Retardez JS pour optimiser les Core Web Vitals et les faibles performances des campagnes Facebook ADS.

Comment la sur-optimisation de Core Web Vitals et le retard de Javascript peuvent tuer vos campagnes publicitaires sur Facebook.

Nous l'avons dit et dit, le score PageSpeed ‚Äč‚Äč‚Äč‚Äčet l'optimisation de Vitaux Web de base elles sont importantes, mais il faut trouver un compromis entre une partition qui apporte des avantages et une partition qui n'apporte que de la vanit√©.

Nous l'avons r√©it√©r√© et soulign√© dans cet article lorsque nous avons expliqu√© les dangers d'utiliser background-image plut√īt que la balise html img pour tromper Google PageSpeed, vous devez trouver un compromis et ne pas vous laisser berner par des mesures de vanit√©.

Le problème est toujours qu'il y a un manque de compétences, d'honnêteté, ou parfois les deux.

Ou, plus simplement, le client arrive qui part deexpert Vitaux Web de base Et il dit :

‚ÄúU√®√®√®√®√®√® Artiste !!! Mais tu sais que Grand Looca dit que les campagnes n√©cessitent des sites aussi rapides que des missiles sol-air et que mon ami qui fait du marketing d'affiliation avec des sites Web rapides a achet√© la nouvelle BMW M3 Sport et a un score PageSpeed ‚Äč‚Äčde 91 sur mobile ? Allez, envoyez-moi vite le site et je vous paierai mille euros !!!‚ÄĚ

Et voici l'artiste web designer, le développeur web ou le web performer tel qu'il est à la mode aujourd'hui, tout simplement performe sans sourciller.

C'est une pratique, un √©tat d'esprit, d'ex√©cuter et de mettre en Ňďuvre ce que le client demande, en √©vitant de donner des conseils et de soulever des objections sur la demande et sur les implications n√©fastes qui pourraient en d√©couler.

Et s'il y réfléchit et ne me laisse plus faire l'optimisation, ou pire, il ne me laisse plus le faire mais laisse quelqu'un d'autre le faire à ma place ?

Mieux vaut se taire et le voilà qui revient au bout de quelques jours et vous ramène le site aux partitions mobiles stratosphériques. Non seulement cela ne vous a pas aidé, mais au contraire cela vous a créé de sérieux problèmes, que vous paierez à vos dépens à l'avenir, comme obtenir dépenser beaucoup d'argent pour la publicité FB et les campagnes qui ne fonctionnent pas comme elles le devraient avec une chute très élevée.

 

PageSpeed ‚Äč‚Äč‚Äč‚ÄčInsights Asso360 Mobile

Vous devez tenir compte du fait que Facebook est l'un des meilleurs endroits pour faire de la publicit√© pour toute entreprise. Il existe de nombreuses fa√ßons de cr√©er les annonces parfaites pour vos besoins, et vous pouvez √©tablir un budget dans leur module d'annonces pour chaque type d'annonce de mani√®re unique. Cela signifie que vous pouvez g√©n√©rer du trafic vers votre site Web avec vos publicit√©s Facebook, √† un co√Ľt tr√®s faible.

Mais que se passe-t-il si vos publicit√©s Facebook ne g√©n√®rent pas les r√©sultats qu'elles avaient l'habitude d'√™tre ? Cela pourrait √™tre d√Ľ aux r√©centes mises √† jour iOS14. Cela est d√Ľ aux fonctionnalit√©s de suivi qu'Apple a bloqu√©es. Bien que cela ait pu √™tre tr√®s utile d'un point de vue s√©curit√©, c'est un changement inutile li√© √† la publicit√©, dont nous allons tous payer le prix, quand le produit qui co√Ľtait auparavant 100 euros, aujourd'hui avec l'augmentation des co√Ľts de publicit√© nous allons payer 120.

Revenant au discours de l'autre baisse des campagnes facebook √† la place, cela pourrait aussi √™tre d√Ľ √† une sur-optimisation de la Vitaux Web de base, aller √† tout prix chercher un score optimal et donc abuser de la fonction js delay trouv√©e dans de nombreux plugins d'optimisation des performances.

Que signifie le Drop d'une campagne Facebook ?

Par Drop d'une campagne Facebook dans le jargon technique, nous entendons cette situation dans laquelle la campagne ne fonctionne pas comme elle le devrait, et en particulier le phénomène dans lequel Facebook envoie du trafic payant des campagnes vers votre site de commerce électronique et votre site de commerce électronique n'enregistre pas la visite par donner des commentaires à FB et envoyer des événements tels que la visite elle-même.

Facebook pense et raisonne ainsi : je vous ai envoy√© 1000 visiteurs potentiellement cibl√©s avec les crit√®res que vous avez saisis, sur ces 1000 utilisateurs que je vous ai envoy√©s sur Facebook (et dont je sais que je vous ai envoy√©) pas moins de 800 (soit 80 %) √† gauche tout de suite, donc je Facebook pense que :

  1. Vous avez le site qui ne fonctionne pas et est en panne.
  2. Vous avez un site lent qui ne se charge pas et les utilisateurs quittent immédiatement.
  3. Vous avez un site qui n'est pas pertinent ou avec une créativité crasseuse et laide avec une mauvaise convivialité.
  4. Vous avez un site sur lequel le pixel ne fonctionne pas et je ne peux pas suivre les événements.

Quoi qu'il en soit, Facebook a un int√©r√™t exclusif √† mener des campagnes qui fonctionnent et g√©n√®rent des profits, toutes celles qui ne marchent pas ne courent tout simplement pas ou courent √† un co√Ľt plus √©lev√© en omettant de profiler et de suivre les personnes concern√©es.

En d'autres termes, cela signifie des d√©penses tr√®s √©lev√©es et un rendement minimum, le cauchemar de chaque entrepreneur, de chaque annonceur et de chaque filiale de commercialisation qui, √† cause de cela, ne pourra pas vivre la vie de r√™ve dans une villa et une piscine √† Duba√Į avec Big Looca.

Qu'est-ce que le pixel Facebook ?

Le pixel Facebook est un code qui peut être inséré dans un site Web pour suivre les utilisateurs qui visitent le site et utiliser ces informations pour créer des publicités ciblées sur Facebook. Ce code nous permet de suivre les actions des utilisateurs sur le site, telles que les pages visitées et les produits achetés, et d'utiliser ces informations pour créer des publicités personnalisées sur Facebook.

Le Pixel Facebook vous permet de :

  • Cr√©ez des publicit√©s cibl√©es en fonction des actions des utilisateurs sur le site, telles que les pages visit√©es et les produits achet√©s.
  • Cr√©er des publicit√©s personnalis√©es pour les utilisateurs qui ont d√©j√† visit√© le site.
  • Cr√©ez des publicit√©s cibl√©es en fonction de votre audience.
  • Suivre les conversions, c'est-√†-dire les actions entreprises par l'utilisateur, comme un achat.

Comment fonctionne Facebook Pixel ?

Le fonctionnement du Facebook Pixel lui-même est assez simple. Nous ne l'analyserons pas du point de vue du code Javascript, il nous suffira de savoir grossièrement comment cela fonctionne :

  1. Un utilisateur visite votre site Web en effectuant certaines actions comme rechercher des produits, les ajouter au panier, terminer le paiement, etc.
  2. Le pixel Facebook suit ces événements et se synchronise avec les cookies Facebook dans le navigateur Web de l'utilisateur.
  3. Après le processus de synchronisation, l'utilisateur est marqué comme faisant partie de certains groupes cibles.
  4. Lorsque l'utilisateur ouvre Facebook, la plateforme sait déjà quelles publicités afficher.

 

Il faut garder à l'esprit un concept très clair, le pixel Facebook est un code Javascript. Rappelez-vous, un code… Javascript.

Retard et optimisation Javascript Vitaux Web de base.

Le d√©lai JavaScript est un terme utilis√© pour d√©crire le temps entre le chargement effectif d'une page Web et le moment o√Ļ les scripts JavaScript qu'elle contient sont ex√©cut√©s.

La principale raison pour laquelle le retard de JavaScript peut affecter les performances du site Web est que les scripts JavaScript peuvent ralentir le chargement de la page. Si un script JavaScript doit √™tre ex√©cut√© avant le chargement complet de la page, cela peut entra√ģner un retard dans l'affichage de la page pour les utilisateurs.

Le retard de JavaScript peut √©galement affecter les valeurs de Google Vitaux Web de base, qui est une s√©rie de mesures utilis√©es par Google pour √©valuer la qualit√© de l'exp√©rience utilisateur sur les sites Web. Parmi ceux-ci, le temps de chargement de la premi√®re r√©ponse (First Contentful Paint ‚Äď FCP), qui mesure le temps entre le chargement effectif de la page et le moment o√Ļ le premier √©l√©ment visible s'affiche, peut √™tre affect√© par le d√©lai javascript, comme un temps d'ex√©cution excessif des scripts javascript peut entra√ģner un retard dans le rendu effectif de la page.

Parler du retard de Javascript en tant que technique, signifie nécessairement au moins à des fins purement informatives introduire Gijo Varghèse, un programmeur indien qui aime se définir blogueur (30%), développeur (60%) et entrepreneur (10%). Un passionné de vitesse WordPress.

Ce jeune programmeur axé sur l'optimisation des sites Web et des performances, a pensé à un moment donné pour améliorer le score PageSpeed (à l'époque le concept de Vitaux Web de base) pour charger les fichiers Javascript avec un retard, un retard en fait.

Cette technique, il l'a appelée Flyng Script (probablement en l'honneur des clients qui veulent des sites qui volent).

La motivation du Delay Javascript est assez facile √† comprendre, l'un des pires facteurs en termes de score PageSpeed ‚Äč‚Äč‚Äč‚Äčet de vitesse de chargement sont les fichiers Javascript.

Les causes sont principalement les suivantes :

  1. Il en existe généralement beaucoup notamment sur les sites WordPress et de nombreux plugins.
  2. Ils ont un poids au niveau des kilo-octets qui n'est pas indifférent.
  3. Ce ne sont pas des langages de balisage comme HTML ou des styles comme CSS, mais des langages de programmation qui sont trait√©s c√īt√© client et impactent donc √† la fois les ressources mat√©rielles et la r√©activit√© sur des appareils pas tr√®s rapides.

Quiconque a essay√© de faire un test PageSpeed ‚Äč‚Äč‚Äč‚ÄčInsight avec Javascript charg√© normalement et Javascript charg√© avec un retard aura remarqu√© √† quel point un site charg√© avec cette technique est √©vident en termes de poids et de vitesse (ainsi que de score Pagespeed).

Il est donc pacifique, au moins dans les premiers jours, d'essayer de retarder tout ce qui peut être retardé en essayant de trouver ce feu vert qui satisfait à la fois notre ego et celui du client, cependant, comme ils l'enseignent dans l'art de la guerre, il faut avoir peur de ce qu'on ne sait pas et c'est là que les problèmes commencent.

De plus, un d√©veloppeur est-il quelqu'un qui fait ou sait faire des campagnes publicitaires sur Facebook ? Est-il une figure technique capable de comprendre comment ce m√©canisme doit fonctionner ? Non, comme c'est normal, il n'est pas √† bl√Ęmer car il devrait √™tre dirig√© par la personne qui fait de la publicit√© qui √† son tour est une figure qui n'a aucune comp√©tence en programmation et donc des compartiments √©tanches qui ne communiquent pas et voil√† le d√©sastre.

Soyons honnêtes, profondément honnêtes. Nous ne connaissions même pas les implications de ce problème avec la publicité Facebook, parce que nous ne savions pas comment fonctionnaient Facebook Advertising et le Facebook Pixel, nous sommes des ingénieurs système, un peu développeurs mais pas annonceurs.

Nous avons d√Ľ investir du temps et des ressources aupr√®s de nos clients professionnels du marketing affili√© pour comprendre o√Ļ se trouvait le pi√®ge et comprendre sans regret que nous devions prendre du recul et valoriser les objectifs commerciaux plut√īt qu'un simple score Google Pagespeed.

Autres raisons de retarder l'exécution des scripts Javascript

Les donn√©es t√©l√©charg√©es √† partir de serveurs tiers tels que Facebook Page Widget, Facebook Messenger, Facebook Comments, iframe ou des services de chat en direct tels que Tawk.to sont des donn√©es que vous ne pouvez pas contr√īler. Vous ne pouvez pas les compresser, les fusionner ou les mettre en cache, simplement parce qu'ils ne se trouvent pas sur votre h√īte. Ces donn√©es sont souvent tr√®s lourdes et peuvent causer de s√©rieux probl√®mes li√©s √† la vitesse de chargement du site. Pour le voir clairement, vous pouvez utiliser Aper√ßus de Google PageSpeed , GTmetrix ou tout autre outil de test de vitesse √† v√©rifier.

E comme il n'est pas possible de les optimiser, la seule solution pour intégrer les services ci-dessus dans le site Web sans affecter la vitesse des pages est de retarder l'exécution de leurs scripts. En faisant cela, vous réduirez le temps de rendu de votre page et améliorerez les cotes de vitesse sur les outils de test de vitesse de page tels que Time to Interactive, First CPU Idle, Max Potential Input Delay, etc. Cela réduira également la charge utile initiale sur le navigateur en réduisant le nombre de requêtes.

Comment retarder l'exécution de Javascript ?

D'un point de vue purement technique, retarder Javascript revient simplement à ajouter un script Javascript pour retarder l'exécution d'autres scripts Javascript.

Par exemple, tous les plugins WordPress qui implémentent cette fonctionnalité à ce jour sont basés sur le code de Scripts volants écrit par Gijo Varghese. C'est le cas des plugins tels que Flying Scripts, WP Meteor, FlyngPress (une évolution commerciale de Flyng Script qui est gratuite) ou encore le plus connu Wp Rocket.

Il faut dire que si les 3 premiers listés ci-dessus permettent de définir un délai après lequel les fichiers Javascript sont chargés, Wp Rocket (qui est le plus connu et le plus commercial) bien qu'il ait beaucoup plus de fonctions, c'est le seul parmi tant d'autres qui n'a pas et ne vous permet pas de définir un délai d'attente. Il commencera simplement à charger les autres Javascripts lorsqu'une interaction se produit comme, par exemple, une touche de l'appareil ou un défilement.

Cela crée pas mal de problèmes, par exemple, pour les sites qui ont des plugins avec des curseurs Javascript qui restent et attendent jusqu'à ce que l'utilisateur interagisse avec le site en activant l'événement qui conduira au chargement du site.

Dans certains cas, c'est vraiment ennuyeux car le phénomène est créé dans lequel l'utilisateur attend que quelque chose se charge, et le script attend que l'utilisateur interagisse, mais l'utilisateur attend toujours que le curseur se charge. Une situation aussi maladroite que désagréable.

Comment le retard Javascript ou le retard JS impacte-t-il les campagnes Facebook ADS ?

Si vous avez bien suivi et attentivement jusqu'à présent, vous devriez déjà y être arrivé. Reprenons le schéma ci-dessous pour retracer les différentes étapes et comprendre la problématique du Delay JS et du drop des campagnes Facebook.

Nous avons dit que l'utilisateur de Facebook est envoyé sur mon site qui contient le pixel Facebook, le navigateur charge le site qui a cependant le délai JS actif, l'utilisateur ouvre la page, regarde l'image, lit le texte et il sort après deux ou trois secondes et que le pixel Facebook n'a pas encore été chargé, l'événement ne s'est pas déclenché et n'a rien communiqué à Facebook.

Pour Facebook il appara√ģt donc que le visiteur a cliqu√© sur la publicit√© Facebook, a √©t√© redirig√© vers votre site, qui ne s'est pas ouvert.

Peu importe si en fait le visiteur a vu les images, le logo, le texte et la description et que seul le pixel Facebook n'a pas été chargé, car le pixel Facebook est "le test décisif" que le site a chargé et a précisément l'événement.

Doit-il ou non utiliser la technique Delay JS ?

Cette technique doit être utilisée pour les scripts liés à l'interaction de l'utilisateur ou chat en direct tels que Facebook Customer Chat, Facebook Widget, Facebook Comment, iframe (Youtube, Google Maps), Tawk.to, ...

Sinon, il n'est pas recommand√© pour les scripts tels que le suivi ou l'analyse des donn√©es des utilisateurs tels que Google Analytics, Facebook Pixel, Google Tag Manager, Crazy Egg, Google Remarketing Tag, car l'application de cette technique peut entra√ģner un √©chec de l'enregistrement des donn√©es ou les rendre incompl√®tes ou inexactes. .

Le bon compromis si vous utilisez les plugins cités plus haut, c'est d'utiliser le Delay du JS mais en même temps exclure des options les plugins impliqués dans le chargement du pixel Facebook comme on peut le faire sur Wp Rocket (ce que personnellement je n'aime pas à cause du manque de timout).

 

Il est toujours pr√©f√©rable d'avoir un site avec un score PageSpeed ‚Äč‚Äčinf√©rieur qui suit tous les √©v√©nements et vous permet d'avoir des campagnes performantes et un retour sur profit gratifiant, que d'avoir un site web avec un score de 100 et d'avoir Facebook qui vous fait d√©penser des sommes faramineuses sans rien vendre.

 

Vous avez des doutes ? Vous ne savez pas par o√Ļ commencer ? Contactez-nous


Nous avons toutes les réponses à vos questions pour vous aider à faire le bon choix.

Discute avec nous

Discutez directement avec notre support avant-vente.

0256569681

Contactez-nous par téléphone pendant les heures de bureau 9h30 - 19h30

Contactez-nous en ligne

Ouvrez une demande directement dans l'espace contact.

INFORMATIONS

ManagedServer.it est le premier fournisseur italien de solutions d'hébergement hautes performances. Notre modèle d'abonnement est abordable et prévisible, afin que les clients puissent accéder à nos technologies d'hébergement fiables, à nos serveurs dédiés et au cloud. ManagedServer.it offre également d'excellents services d'assistance et de conseil sur l'hébergement des principaux CMS Open Source tels que WordPress, WooCommerce, Drupal, Prestashop, Magento.

JUSTE UN MOMENT !

Souhaitez-vous voir comment votre WooCommerce fonctionne sur nos syst√®mes sans avoir √† migrer quoi que ce soit ? 

Entrez l'adresse de votre site WooCommerce et vous obtiendrez une démonstration navigable, sans avoir à faire absolument quoi que ce soit et entièrement gratuite.

Non merci, mes clients préfèrent le site lent.
Retour en haut de page