web-dev-qa-db-fra.com

résultats étranges des tests en essayant de servir une page de téléchargement rapide d'images ... pourquoi?

Ceci est mon code php.

    <?php
    ob_start();
    echo file_get_contents("originalhighqualityphoto.jpg");
    $dat=ob_get_contents();
    ob_end_clean();
    $dat=gzencode($dat,2);
    header("content-disposition: attachment; filename=\"OptimizedPhoto.jpg\"",true);
    header("content-encoding: gzip",true);
    header("content-type: image/jpeg",true);
    header("cache-control: max-age=1000000",true);
    header("content-length: ".strlen($dat),true);
    echo $dat;exit();
    ?>

Ce que j'essaie de faire, c'est de faire en sorte que les images soient téléchargées à une qualité de 100% et plus rapidement sur mon site Web, sans avoir à les offrir au format Zip. Je ne veux pas utiliser la compression d'image directe (comme avec photoshop par exemple), car elle est déjà utilisée ailleurs sur mon site en tant qu '"aperçus" des images de haute qualité.

J'ai testé le téléchargement dans mon propre navigateur Web (Opera v11.6) et il fonctionne normalement.

Voici ce qui me jette. J'ai utilisé webpagetest.org pour essayer de télécharger les images et les résultats les plus étranges sont les suivants:

Via firefox à webpagetest.org:

Leverage browser caching of static assets: 75/100

WARNING - (1.8 days) - http://ciscobinary.openh264.org/openh264-win32-v1.3.Zip 

Remarque: je n'ai nommé aucun fichier sous forme de fichier Zip et lorsque j'ai accédé manuellement à ce fichier, celui-ci contenait deux fichiers aléatoires, l'un étant un fichier dll.

Testez via IE8 à webpagetest.org:

Compress Images: 62/100

8.0 KB total in images, target size = 5.0 KB - potential savings = 3.0 KB

FAILED - (8.0 KB, compressed = 5.0 KB - savings of 3.0 KB) - http://example.com/path/to/testphpfile.php

Je ne comprends pas d'où vient la taille de 8,0 Ko lorsque l'image utilisée lors du test dépasse 100 Ko.

Dans chrome via webpagetest.org, le test semble correct.

Dans les aperçus de la vitesse de la page, le score est correct mais la sortie est tronquée.

Properly formatting and compressing images can save many bytes of data. Optimize the following images to reduce their size by 36.8KiB (20% reduction).

    Losslessly compressing http://example.com/path/to/testphpfile.php could save 36.8KiB (20% reduction).

En outre, dans les analyses de vitesse de page testées via mobile, il est question de configurer une fenêtre d'affichage, mais je ne pense pas que ce soit possible avec un en-tête HTTP uniquement.

en parlant de .... Les en-têtes sont-ils à l’origine de ces résultats ou y at-il autre chose que je dois faire pour rendre le script de téléchargement d’image fonctionnel et convivial?

3
Mike

En ce qui concerne le problème de WebPageTest concernant le fichier openh264, je ne le sais franchement pas, mais je soupçonne Alex Berry d’avoir probablement raison dans son commentaire, bien que je ne puisse pas le confirmer avec des informations que j’ai pu trouver à ce sujet.

En ce qui concerne la recommandation de PageSpeed ​​Insights d’utiliser la compression sans perte, je suppose que vous devrez changer le format de fichier de JPEG (. Jpg) à Portable Network Graphics (. Png) en atteindre cet objectif de manière optimale.

En ce qui concerne la recommandation de PageSpeed ​​Insights de spécifier une fenêtre d'affichage, elle est réalisée à l'aide de HTML. Elle constitue un problème distinct de la compression des images et de la vitesse de téléchargement. Elle concerne uniquement la compatibilité et l'accessibilité de votre site Web avec des appareils mobiles.

Pour tirer le meilleur parti de GZip et de la mise en cache du navigateur pour vos photos, procédez comme suit:

<?php
$aHeaders = array();

/* Content/Behaviour Headers */
$aHeaders[] = 'Content-Type: image/jpeg';
$aHeaders[] = 'Content-Disposition: attachment; filename="OptimizedPhoto.jpg"';

/* Browser Cache for 35 days */
$iCacheSecs = 3024000; // 60 secs * 60 mins * 24 hours * 35 days
$dtNow = time();
$dtExpires = strtotime( sprintf( '+%s seconds', $iCacheSecs ));
$aHeaders[] = 'Expires: ' . date( 'r', $dtExpires );
$aHeaders[] = 'Last-Modified: ' . date( 'r', $dtNow );
$aHeaders[] = 'Cache-Control: public, must-revalidate, max-age=' . $iCacheSecs );

/* Generate Unique ETag */
$sData = @file_get_contents( 'originalhighqualityphoto.jpg' );
$sETag = md5( $sData );
$aHeaders[] = sprintf( 'ETag: %s', $sETag );

/* Send HTTP 304 response if resource same as held in browser cache */
$sSuppliedETag = isset( $_SERVER['HTTP_IF_NONE_MATCH'] ) ?
  $_SERVER['HTTP_IF_NONE_MATCH'] : '';
if( $sSuppliedETag == $sETag ) {
  header( 'HTTP/1.1 304 Not Modified' );
  header( 'Content-Length: 0' );
  exit;
}

/* GZIP Compression, Send Headers, Send Content */
if( !ob_start( 'ob_gzhandler' )) ob_start();
foreach( $aHeaders as $sHeader ) header( $sHeader );
echo( $sData );
exit;
1
richhallstoke