Comment charger tarteaucitron de manière asynchrone ?

[ortolojf]

Bonjour

Après avoir bien optimisé tarteaucitron.js , tarteaucitron.services.js , et tarteaucitron.css ( en prenant les scripts préconisés par Google insights ), j'obtiens encore l'indication suivante, quand j'essaye de charger la page :

https://www.pronostics-courses.fr/php/courses_anciennes/old_courses.php :

-------------------------------------------------------------------------------------------------------

Éliminer les codes JavaScript et CSS qui bloquent l'affichage du contenu au-dessus de la ligne de flottaison
Votre page contient 1 ressources de script qui bloquent l'affichage de votre page, et donc le retardent.
Aucune partie du contenu situé au-dessus de la ligne de flottaison sur votre page n'a pu être affichée avant que le chargement des ressources suivantes n'ait été terminé. Essayez de différer le chargement des ressources qui bloquent votre page, de les charger de manière asynchrone, ou d'intégrer les parties essentielles de ces ressources directement dans le code HTML.
Supprimez les ressources JavaScript qui bloquent l'affichage :

https://www.pronostics-courses.fr/tarteaucitron/tarteaucitron.js

--------------------------------------------------------------------------------------------------------

Que faire pour charger ce script de manière asynchrone ?

Il fait 36.418 octets. Je le met dans le code HTML ?

Merci beaucoup.

A part çà, il ne me reste plus que les caches des urls externes genre : https--//twitter.com , que je peux pas mettre en cache. ;(

Super merci pour vos réponses.

Respectueusement.

 

[Supermaury]

Bonjour.

En rajoutant simplement le mot ASYNC dans ta balise <script>.

Plus d'info sur AlsaCréations.

Bonne fin de journée.

 

[ortolojf]

Bonjour Supermaury

Cà ne marche pas.

La ressource "tarteaucitron" est undefined quand elle devrait être affectée ( avec un attribut ).

Le code HTML direct ne marche pas non plus, cause les sous-répertoires avec erreur dans les scripts.

Je peux essaye de modifier les scripts , mais gare aux effets de bord...

Est-ce qu'il est possible de mettre tous les scripts tarteaucitron avant le body fermant ?

Respectueusement.

 

[ortolojf]

Rebonjour

Le seul problème du script de Amaury, c'est la nécessité de lancer le script, sans possibilité de le mettre dans le code HTML.

Ce script est censé lire le répertoire courant, et appeler d'autres sous-scripts.

Sinon, j'ai tout mis avant le body fermant, ( script + html ).

Je pourrais tripatouiller dans le code javascript pour fixer le répertoire racine, mais pour seulement lancer en mode asynchrone ordonné, comment utiliser async.map ?

Merci beaucoup de votre aide.

 

[ortolojf]

Bonjour

Pour lancer de manière asynchrone le script tarteaucitron.js, j'ai trouvé sur le net ce truc :

Est-ce que çà marcherait en mode asynchrone ( is_async = true ) ?

Est-ce que is_async = true, rendrait possible le chargement de callback avant celui de tarteaucitron.js ( ce que je ne souhaite pas ) ?

Merci beaucoup de vos réponses.

J.F. Ortolo

function loadScript(url, callback, is_async)
{
    // Adding the script tag to the head as suggested before
    var head = document.getElementsByTagName('head')[0];
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = url;
    script.async = is_async;
    // Then bind the event to the callback function.
    // There are several events for cross browser compatibility.
    script.onreadystatechange = callback;
    script.onload = callback;
    // Fire the loading
    head.appendChild(script);
}
Then you write the code you want to use AFTER the script is loaded in a lambda function:
var myPrettyCode = function() {
   // Here, do whatever you want
   // Le code Javascript direct HTML après tarteaucitron.
};
loadScript("tarteaucitron.js", myPrettyCode, true);

 

[ortolojf]

Rebonjour

Voilà c'est fait, tout en asynchrone.

J'ai du remplacer cdn=split( ) qqchose par : cdn='https://www.pronostics-courses.fr/tarteaucitron/', car le script se voyait comme lancé de la racine.

J'ai le plaisir d'avoir sur Google Insights : 99/100 smartphone et 96/100 desktop.

Maintenant, le tour aux autres scripts.

Respectueusement.

 

[WebRankInfo]

bravo ! j'ai regardé ton code, je vois /tarteaucitron/new/permission.php qui ne semble pas faire partie de l'install de base, ça vient d'où ?
merci d'avance

 

[ortolojf]

Bonjour Monsieur Wri

permission.php indique si le visiteur est Européen ou non.

Je ne sais pas comment le savoir en Javascript.

Voici le code :

<?php
header("Cache-Control: no-cache");
header("Content-type: text/plain; charset=ISO-8859-1");
$continent = geoip_continent_code_by_name($_SERVER['REMOTE_ADDR']);
if($continent == 'EU')
{
        echo "NO";
}
else
{
        echo "YES";
}
?>

Le code Javascript est facile à copier, mais il y a seulement très peu d'ajustements pour les scripts d'Amaury.

Merci beaucoup, votre site est super.

Sans vous, mon site n'aurait pas existé.

Respecteusement.

Jean François Ortolo

 

[WebRankInfo]

merci ! la fonction geoip_continent_code_by_name n'est-elle pas trop gourmande (en temps) ? car j'ai l'impression qu'elle est appelée pour chaque affichage de page ?

 

[ortolojf]

Bonjour Monsieur Wri

Cette fonction ( chargement de permission.php ) n'est lancée que si old_permisssion ( ancienne valeur ) n'a pas déjà été mis dans le cookie tarteaucitron.

Sinon, et si tarteaucitron n'est pas trop ancien, c'est la valeur enregistrée qui est affectée : permission= old_permission.

Tous les scripts sont lancés de manière asynchone.

La valeur initiale de permission est 'NO', et la valeur réelle ( de la fonction ) est mise dans le cookie de manière asynchrone.

Tous les scripts Javascript sont en dessous de : /* Ecrit dans le cookie tarteaucitron. */

Merci beaucoup pour votre site.

Amicalement.