Validateur JavaScript

Bonjour,
je suis en ce moment sur des essais de lazy loading sur un site en local. Ça ne fonctionne pas encore mais c'est normal, c'est de l'expérimentation. Par contre, lorsque je teste mon code JavaScript sur un validateur, j'ai, entre autres, deux réponses incompréhensibles. Le validateur me dit que le premier crochet <script> est en trop (Unexpected '<'.). Je dois l'enlever pour aller plus loin, mais j'ai alors une autre erreur ('script' was used before it was defined). Dans un autre test, je dois mettre un \ en plus sur le <\/script> de fin !!!
D'autres erreurs que je n'arrive pas à comprendre son aussi présentes. Le JavaScript, c'est pas comme le html, le validateur s'arrête à la première erreur et ne va pas plus loin. Le code et les erreurs :

 <script>
// create config object: rootMargin and threshold
// are two properties exposed by the interface
const config = {
  rootMargin: "0px 0px 50px 0px",
  threshold: 0
};
// register the config object with an instance
// of intersectionObserver
let observer = new intersectionObserver(function(entries, self) {
  // iterate over each entry
  entries.forEach(entry => {
    // process just the images that are intersecting.
    // isIntersecting is a property exposed by the interface
    if(entry.isIntersecting) {
      // custom function that copies the path to the img
      // from data-src to src
      preloadImage(img);
      // the image is now in place, stop watching
      self.unobserve(img);
    }
  });
}, config);
	// Finally, you iterate over all of your images and add them to this iterationObserver instance:
const imgs = document.querySelectorAll("[data-src]");
imgs.forEach(img => {
  observer.observe(img);
});
</script>

Les erreurs :
-----------------------------------
'script' was used before it was defined.
script>
2 1 7 Missing space between 'script' and '>'.
script>
3 5 1 Expected 'const' at column 5, not column 1.
const config = {
4 5 1 Unexpected 'const'.
const config = {
5 5 7 Stopping. (15% scanned).
Ou alors :
Expected '<' at column 1, not column 5.
2 1 5 Unexpected '<'.
3 1 6 Stopping. (3% scanned).

https://codebeautify.org/jsvalidate
Merci pour l'aide.

Je pense que le validateur que tu utilises s’attend à ce que tu lui donnes l’intérieur de la balise <script> et pas la balise elle-même
Modifié par PapyJP (12 Jun 2020 - 12:47)

Salut,
oui, il semble que ce soit la raison. J'ai essayé sans <script> de début et de fin, l'erreur n'est plus signalée. Du coup, le code est lu en entier cette fois et j'ai pas mal d'erreur que je ne sais pas interprêter. C'est le JavaScript que je ne maîtrise pas assez, mais j'aimerais au moins faire quelques essais de lazy loading. Le faire avec l'API IntersectionObserver est le plus simple, hormis la prise en charge directe par les navigateurs, peu implantée pour le moment. Firefox 68 utilise l'API et à défaut, on peut l'activer dans about/config.
Merci.

Mon validateur https://esprima.org/demo/validate.html ne trouve pas d'erreur de syntaxe

Bongota a écrit :
Salut,
oui, il semble que ce soit la raison. J'ai essayé sans &lt;script&gt; de début et de fin, l'erreur n'est plus signalée. Du coup, le code est lu en entier cette fois et j'ai pas mal d'erreur que je ne sais pas interprêter. C'est le JavaScript que je ne maîtrise pas assez, mais j'aimerais au moins faire quelques essais de lazy loading. Le faire avec l'API IntersectionObserver est le plus simple, hormis la prise en charge directe par les navigateurs, peu implantée pour le moment. Firefox 68 utilise l'API et à défaut, on peut l'activer dans about/config.
Merci.

Franchement si tu ne maîtrises pas assez le JavaScript, se lancer dans des techniques d'optimisations marginales en utilisant une API expérimentale ne me semble pas la meilleure chose à faire, mais c'est toi qui vois.

Bonne nouvelle si ton validateur donne un code correct.
L'API IntersectionObserver n'est plus vraiment expérimentale, elle est largement utilisée, en place depuis quelques temps sur les navigateur récents, même si c'est encore nouveau.
Dans un sens, tu as raison pour le JavaScript, mais ne je suis rarement des cours formels, je travaille sur le tas, quitte à en baver. Je ne maîtrisait pas non plus grid au début (et pas totalement maintenant). Pourtant, je me suis lancé dedans à "l'aveugle" et j'ai réalisé un site en ligne qui tient debout, plus d'autres en local. Je fais la même chose avec le JavaScript, sans pour autant ne pas aller voir les cours formels de temps en temps. D'où mes questions sur ce forum.
En tous cas, le site fonctionne sans le Lazy Loading, c'est juste pour expérimenter.
Bonne Journée.