Fetch quelles techniques de cache ?

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par ortolojf, 1 Août 2021.

  1. ortolojf
    ortolojf WRInaute accro
    Inscrit:
    14 Août 2002
    Messages:
    3 485
    J'aime reçus:
    28
    Bonjour

    Pour mon gros projet ( dur , dur ), de PWA :

    J'ai imaginé, pour les fetch et cache, de mettre un header associé à chaque url :

    etagXXXXlast_modified , qui ne change pas quand la page ne change pas.

    Je peux présenter les fonctions de ce système de cache, mais j'aurais quelques questions :

    Le chargement par HEAD de ces headers est-il peu ou prou équivalent en durée à un GET ?

    Si c'est le cas, ce système de cache serait foireux et inefficace.

    Dans ce cas, quel autre système de cache serait efficace et fiable ?

    Quelles urls sur le sujet ?

    Merci beaucoup pour vos réponses.
     
  2. ortolojf
    ortolojf WRInaute accro
    Inscrit:
    14 Août 2002
    Messages:
    3 485
    J'aime reçus:
    28
    Bonjour

    Est-ce que mettre le champ Request.cache à "no-cache" n'est pas la solution idéale ?

    D'après cet info sur le net.

    Respectueusement.


    Code:
    
    no-cache
    ********
    
     — The browser looks for a matching request in its HTTP cache.
    If there is a match, fresh or stale, the browser will make a conditional request to the remote server. If the server indicates that the resource has not changed, it will be returned from the cache. Otherwise the resource will be downloaded from the server and the cache will be updated.
    If there is no match, the browser will make a normal request, and will update the cache with the downloaded resource.
    
    
     
    #2 ortolojf, 1 Août 2021
    Dernière édition: 1 Août 2021
  3. ortolojf
    ortolojf WRInaute accro
    Inscrit:
    14 Août 2002
    Messages:
    3 485
    J'aime reçus:
    28
  4. ortolojf
    ortolojf WRInaute accro
    Inscrit:
    14 Août 2002
    Messages:
    3 485
    J'aime reçus:
    28
    Bonjour

    Voici un exemple de requêtes http avec "Cache-Control: max-age==100".

    Ma question : Le serveur se comporte automatiquement, ou bien il faut arranger les headers/scripts etc. ?

    Merci beaucoup de votre aide.


    Code:
    
    CLIENT_1        CACHE        SERVER  
    ********        *****        ******
    GET /doc    =>    =>        =>
    200 OK            <=    200 OK    <=
    idem            Cache-Control: max-age=100
    Age=0            max-age=100 stored
    
                   10 sec later
                   ------------
    CLIENT_2        CACHE        SERVER  
    ********        *****        ******
    GET /doc    =>    max-age=100
    age=10
                             cache is fresh.
    200 OK            <=
    Cache-Control: max-age=100
    Age=10
    
                 100 sec later
                  -------------
    CLIENT_3        CACHE        SERVER  
    ********        *****        ******
    GET /doc    =>    max-age=100
    age=110
                             cache is stale,
                             check freshness.
                            If-None-Match:--
    200 OK            <=    304 Not Modified
    Cache-Control: max-age=100
    Fresh => Age=0
    Return cache
          
    
     
  5. ortolojf
    ortolojf WRInaute accro
    Inscrit:
    14 Août 2002
    Messages:
    3 485
    J'aime reçus:
    28
    Rebond

    Merci de corriger cette description des échanges HTTP :

    Très respectueusement.



    Code:
    
    no-cache
    ********
    
     — The browser looks for a matching request in its HTTP cache.
    If there is a match, fresh or stale, the browser will make a conditional request to the remote server. If the server indicates that the resource has not changed, it will be returned from the cache. Otherwise the resource will be downloaded from the server and the cache will be updated.
    If there is no match, the browser will make a normal request, and will update the cache with the downloaded resource.
    
    *************************************************************************************************
                                Implémentation du cache :
                                *************************
    
    *************************************************************************************************
    
        Expires ou Cache-Control max-age, 
        Last-Modified ou ETag
    
    *************************************************************************************************
    
                    En-tête SERVER:
                    ***************
                    Cache-Control: max-age=N
                    Age
                    ou 
                    Expires: Wed, 21 Oct 2015 07:28:00 GMT
                    Content-Location
                    Date   
                    ETag
                    ou
                    Last-Modified:Wed, 21 Oct 2015 07:28:00 GMT
                    Vary: User-Agent
    
                    En-tête CLIENT:
                    ***************
                    Cache-Control
                    Age
                    If-None-Match: "etag1", "etag2"    => vérification faible.
                    If-None-Match: *    ( method PUT )
                    If-Modified-Since:Wed, 21 Oct 2015 07:28:00 GMT
    
    *************************************************************************************************
    
                CLIENT                                    SERVER
                ******                                    ******
                                                    Pages HTML
                                                    **********
                                                Cache-Control: max-age=N
                                                Cache-Control: ?
    
                                                    Scripts CSS
                                                    ***********
                                                Cache-Control: max-age=N
                                                Cache-Control: ?
    
                                                    Scripts JS
                                                    **********
                                                Cache-Control: max-age=N
                                                Cache-Control: ?
    *************************************************************************************************
                                                    Scripts PHP
                                                    ***********
                CLIENT                                SERVER
                ******                                ******
            Cache-Control: no-cache                                           
                                                    1er essai
                                                    *********
                                                    si existe SERVER "Cache-Control: max-age=N"
                                                        freshnessLifetime=N;
                                                    et CLIENT "Age"
                                                    => (Age > N => stale)
                                                        else fresh.
                                                    XOR
                                                    ***
                                                    1er essai
                                                    *********
                                                    si existe SERVER "Expires: Wed, 21 Oct 2015 07:28:00 GMT"
                                                        et SERVER "Date"
                                                            freshnessLifetime="Expires" - "Date";
                                                        et SERVER "Age" ou Age = 0
                                                expirationTime    = responseTime + freshnessLifetime - Age
                                                responseTime    = le moment auquel a été reçue la réponse selon le navigateur.
                                                => (freshnessLifetime < Age => stale)    ?
                                                        else fresh.
                                                    if stale
                                                    ********
                                                    2ème essai
                                                    **********
                                                    si existe SERVER => "Etag"
                                                    et CLIENT "If-None-Match": "etag1", "etag2"
                                                    ( comparaison faible )
                                                    XOR
                                                    ***
                                                    2ème essai
                                                    **********
                                                    si existe SERVER "Last-Modified:Wed, 21 Oct 2015 07:28:00 GMT"
                                                    et SERVER "Date"
                                                        freshnessLifetime="Date" - "Last-Modified";
                                                        et CLIENT "If-Modified-Since: Wed, 21 Oct 2015 07:28:00 GMT"
                                                => ("If-Modified-Since" < "Last-Modified" => stale)    ?
                                                        else fresh.
    
    *************************************************************************************************
    
        CLIENT Réponse
        **************
            fresh :
            *******
            GET HTTP 304 (Not Modified)
            ou
            HEAD HTTP 304 (Not Modified)
    
            Le serveur DOIT générer toutes les en-têtes qui auraient été envoyées avec une réponse 200 (OK) à la même requête : Cache-Control, Content-Location, Date, ETag, Expires, and Vary.
            stale:
            ******
            GET HTTP 200 (OK)
            HEAD HTTP 200 (OK)
    
    *************************************************************************************************
    
    
     
  6. ortolojf
    ortolojf WRInaute accro
    Inscrit:
    14 Août 2002
    Messages:
    3 485
    J'aime reçus:
    28
    Bonjour

    Voilà un exemple d'algorithme de cache.

    Merci de corriger.

    Code:
    
        CLIENT                    SERVER
        ******                    ******
        "Age"
        "If-None-Match": "etag1", "etag2"
    
                                "Age"
                                "Cache-Control: max-age=N"
                                "Date: <now date value>"
                                "Expires: <expire date value>"
                                "Etag"
    
    
    
                                ----<N Age>N Y>------
                                |                    |
                            ---------                |
                            | fresh |                |
                            ---------                |
                                                    |
                                -----------------------------------------
                                | freshnessLifetime="Expires" - "Date"; |
                                -----------------------------------------
                                                    |
                                                    |
                                    ----------------------------
                        ------------<N freshnessLifetime >= Age Y>-------
                        |            ----------------------------        |
                        |                                                |
                        |                                            ---------
                        |                                            | fresh |
                        |                                            ---------
                        |
        -----------------------------------------
    ---<N            Matche weak                    Y>-----------
    |    |                "Etag"                    |            |
    |    |                avec                      |            |
    |    |    "If-None-Match": "etag1", "etag2"    |            |
    |    -----------------------------------------            |
    |                                                    ---------
    |                                                    | fresh |
    |                                                    ---------            
    |                ---------
    ----------------| stale |
                    ---------
                    Faut-il faire
                    comparaison
            "If-Modified-Since" "Last-Modified"
                        ?
    
    
    
    
    
    
     
Chargement...
Similar Threads - Fetch techniques cache Forum Date
prepare-> ( bindParam->execute->fetchAll->closeCursor ) plusieurs fois ? Développement d'un site Web ou d'une appli mobile 21 Octobre 2020
Chargement composants par JS (fetch) - indexation dans Google Crawl et indexation Google, sitemaps 9 Octobre 2020
Liens en Javascript en prefetch sous Chrome ? Développement d'un site Web ou d'une appli mobile 2 Janvier 2016
Warning: MagpieRSS: Failed to fetch Développement d'un site Web ou d'une appli mobile 15 Avril 2015
Variable n'acceptant pas fetch() Développement d'un site Web ou d'une appli mobile 17 Avril 2012
PHP -> PDO -> Fetch Développement d'un site Web ou d'une appli mobile 12 Avril 2012
Cherche outils pour fiches techniques Développement d'un site Web ou d'une appli mobile 11 Avril 2018
Optimisations techniques, temps de chargement - GOLIAT.FR Problèmes de référencement spécifiques à vos sites 22 Février 2018
Je fais du spectacle, est ce que vos techniques sont vraiment utiles pour mon activité Débuter en référencement 23 Juillet 2017
11 techniques avancées pour réutiliser un vieux contenu Référencement Google 12 Janvier 2017