interface réseau d'une PWA.

[ortolojf]

Bonjour

J'ai étudié le protocole de cache HTTP.

Je me prépare à la conception/programmation d'une PWA, censée représenter mon site web de statistiques/pronostics courses de chevaux.

Les PWA ont des caches spécifiques avec logique programmée dans les réponses à l'event Fetch.

Mais il y a aussi en amont, la logique du protocole de cache HTTP.

Ma question : ces réponses à l'event Fetch dans la PWA, doivent-elle ( c'est probable ), en amont simuler un navigateur, c'est-à-dire comporter ce protocole de cache HTTP ?

Et en aval, les caches spécifiques de la PWA.

Si oui, ( c'est annexe ), y a-t-il déjà sur le net, des librairies Javascript implémentant ces caches ?

Merci beaucoup de vos réponses.

Amicalement.

 

[spout]

Non

 

[colonies]

https://github.com/jakearchibald/idb
Et de la doc : https://developer.mozilla.org/fr/docs/Web/API/Cache

Mais le fetch passe de toute façon par le cache du navigateur, le reste c'est si tu veux mettre en place un cache toi-même pour un fonctionnement offline (surtout).
Tu devrais commencer par un truc simple où tu ne mets rien en cache toi-même.

There are only two hard things in Computer Science: cache invalidation and naming things.
-- Phil Karlton

 

[ortolojf]

Bonjour colonies

Evidemment, une PWA déjà installée, dépend du navigateur ?

Si non, son javascript et html ne pourrait pas être interprété.

J'hésite surtout sur les types d'objets à mettre en cache simple, je dispose déjà de routines fetch tout azimut.

Merci beaucoup pour ton aide.

Amicalement.

 

[ortolojf]

Bonjour

Voici deux routines faisant : Cache ou Fetch puis mise en cache.

Quelle est la plus rapide des deux ?

Merci beaucoup.

/**  SIMPLE CACHE THEN NETWORK THEN CACHE  **/

self.addEventListener('fetch', (event) => {
  event.respondWith(async function() {
    const cache = await caches.open('mysite-dynamic');
    const cachedResponse = await cache.match(event.request);
    if (cachedResponse) return cachedResponse;
    const networkResponse = await fetch(event.request);
    event.waitUntil(
      cache.put(event.request, networkResponse.clone())
    );
    return networkResponse;
  }());
});


/**  COMPLEX CACHE THEN NETWORK THEN CACHE  **/

self.addEventListener('fetch', (event) => {
  event.respondWith(async function() {
    const cache = await caches.open('mysite-dynamic');
    const cachedResponse = await cache.match(event.request);
    const networkResponsePromise = fetch(event.request);
    event.waitUntil(async function() {
      const networkResponse = await networkResponsePromise;
      await cache.put(event.request, networkResponse.clone());
    }());
    // Returned the cached response if we have one, otherwise return the network response.
    return cachedResponse || networkResponsePromise;
  }());
});

 

[Jan31]

ortolojf, j'apprécie tes posts, j'aime lire des choses techniques que je ne comprends pas,
Sans vouloir offenser personne, je pense que les participants à ce forum ne sont pas les mieux placés pour t'aider. En dehors de 2 ou 3 geeks. Tu pourrais trouver plus de matière sur les forums de codage.
Mais pour parler seo, c'est ici.

 

[ortolojf]

Ah bon...

Maintenant, j'en suis à la phase de transport des données.

Vaut-il mieux :

- télécharger du HTML?

- télécharger du JSON ?

- lire une base de données distante de type Firebase ?

des points de vue :

- rapidité,

- économie réseau.

Merci beaucoup

 

[ortolojf]

Pardon

En préparation de ma PWA.

J'ai commis une page Mustache, cette technologie semble alourdir le réseau, car les données brutes prennent plus de place que le code html équivalent.

Je pourrais mettre des data avec des variables/clés plus petites.

Voici : https://www.pronostics-courses.fr/tmp_page.php

C'est un calendrier avec des liens hyper-textes réels et pas de onclick.

Merci beaucoup de vos conseils et avis.

 

[ortolojf]

Voilà voilà

C'est beaucoup plus léger.

7944 octet de html.

Vive Mustache !

Après c'est un pensum de déterminer le fixe et le variable des pages.

Dur, dur...

 

[Jan31]

La vie est dure. Voire injuste. Mais c'est la vie.