JeuWeb - Crée ton jeu par navigateur

Version complète : L'optimisation maximale...
Vous consultez actuellement la version basse qualité d'un document. Voir la version complète avec le bon formatage.
Pages : 1 2
Bonjour à toute et à tous.

Je créer ce topic pour que nous parlions ensemble des meilleurs solutions d'optimisations pour nos jeux.
Je veux parler d'optimisations de vitesses, que ce soit coté client ou coté serveur 2

J'imagine cela peut paraitre futile pour certains d'entre vous, mais personnellement je pense que toutes les optimisations sont bonnes à prendre (ne serait-ce que pour économiser des frais de serveurs, ou tout simplement pour la connaissance).


Voici quelques un des conseils (la plupart prodigués par yahoo...) que je vais essayer d'appliquer :
  • Placer les feuilles de styles en haut des documents
  • Placer les scripts dans le bas du documents
  • Placer les documents statiques (images,scripts,css...) sur un autre domaine (CDN)
  • Envoyer des headers cache-control pour tout les contenu statiques
  • Bien configurer les ETags
  • Utiliser une favicon.ico la plus légère possible
  • Utiliser les sprites css plutôt que plusieurs petites images

Voila, à vous les studios 2
Studio Gamboo a écrit :Voila, à vous les studios 2
C'est toi le studio ! 15

Sympatique sujet, ça pourra en aider plus d'un !

Je renvoie vers l'article de Yahoo Best Practices for Speeding Up Your Web Site pour les gens qui veulent avoir les autres astuces (pensez à cliquer sur l'onglet "All" en haut du document). 2

Pour ma part, il y en a certains que je ne comprends pas bien :
  • Les ETags : je ne sais même pas comment ça se défini, je me renseignerais ;
  • L'utilisation d'un autre domaine pour les contenus statiques : ça implique d'avoir un autre serveur à disposition ! 4

L'une des plus simples astuces est l'envoi de données compressées par GZip dont je pense qu'on peut abuser. Même IE4 gérait ça ! D'ailleurs, comment s'intérprète la citation qui suit ?
Citation :Gzipping generally reduces the response size by about 70%.
Mon document qui fait en tout 100 Mo pèse combien en arrivant sur le navigateur client ? 70 Mo ou 30 Mo ?


Sephi-Chan
Pour les ETags, tu peut les désactiver via ton .htaccess assez simplement, si le mod headers d'apache est activé.

Pour l'utilisation d'un autre domaine pour les contenu statique, pas besoin d'un autre serveur, un sous domaine suffit simplement. En fait l'intérêt de cette technique est de détourner la limitation technique des navigateurs actuels qui ne peuvent demander que 2 ressources simultanément par domaine. Avoir deux domaine permet donc de multiplier par deux les requêtes sur le site.

Je rajouterai également, et on ne le dit jamais assez, du coté serveur il fait essayer de mettre en cache le maximum de choses (grosses requêtes sql qui ne changent pas souvent, bout de templates, objets etc...). Ca permet d'allèger souvent le travail sur le serveur 2
Tiens, je vais en profiter pour demander quelque chose à propos de la mise en cache de requête qui ne changent pas souvent. Est-ce que ça veut dire que la requête est la même avec un paramètre différent (l'id d'un joueur par exemple) ? Ou bien est-ce que c'est quand la requête est vraiment statique ?

Concernant le reste, c'est dans ce sens là que je voulais utiliser un cache (typiquement un fichier qui contient le HTML prêt à l'emploi) de différentes parties de pages. Mais ça requiert Nombre de page * Nombre de langue et dans certains cas, le statut du joueur (connecté ou non).

Je pense donc faire ça pour certains bouts de pages et économiser le reste à l'aide d'Ajax.


Sephi-Chan
Je t'avais envoyé un script pour le cache gzip avec etag.

Cela demande la librairie html.so

Code PHP :
<?php
/**
 *
 *    Web D20
 *    Copyright FOURNET Loïc - 2005/2008
 *
 */
require_once dirname__file__ ) . '/_config.php';

if ( 
$_SERVER['HTTP_HOST'] == 'localhost' )
    
define'__ROOTPATH''http://localhost/anthor' );
else
    
define'__ROOTPATH''http://www.anthor.net' );

ob_start();

/**
 *    The mkdir function does not support the recursive parameter in some version of 
 *    PHP run by Web Hosting. This function simulates it.
 */

function mkdir_r$dir_name$rights 0777 )
{
    
$dirs explode"/"$dir_name );
    
$dir "";
    foreach ( 
$dirs as $part )
    {
        
$dir .= $part "/";
        if ( !
is_dir($dir) && strlen($dir) > )
            
mkdir$dir$rights );
    }
}

/**
 *    Wich file are we asking ?
 */
$src_uri str_replace__ROOTPATH '/gz-cache''''http://' $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'] );
$dirname dirname__file__ );

/**
 *    List of known content types based on file extension.
 *    Note: These must be built-in somewhere...
 *    Like finfo_file, to try
 */

$known_content_types = array( "htm" => "text/html""html" => "text/html""js" => "text/javascript""css" =>
    
"text/css""xml" => "text/xml""gif" => "image/gif""jpg" => "image/jpeg""jpeg" => "image/jpeg""png" =>
    
"image/png""txt" => "text/plain" );

/**
 *    Verify the existence of the target file.
 *    Return HTTP 404 if needed.
 */

if ( !is_file($dirname $src_uri) )
{
    
header"HTTP/1.1 404 Not Found" );
    echo ( 
"<html><body><h1>HTTP 404 - Not Found</h1></body></html>" );
    exit;
}

/**
 *    Set the HTTP response headers that will
 *    tell the client to cache the resource.
 */

$file_last_modified filemtime$dirname $src_uri );
header"Last-Modified: " date("r"$file_last_modified) );

$max_age 300 24 60 60// 300 days

$expires $file_last_modified $max_age;
header"Expires: " date("r"$expires) );

$etag dechex$file_last_modified );
header"ETag: " $etag );

$cache_control "must-revalidate, proxy-revalidate, max-age=" $max_age ", s-maxage=" $max_age;
header"Cache-Control: " $cache_control );

/**
 *    Check if the client should use the cached version.
 *    Return HTTP 304 if needed.
 */

if ( function_exists("http_match_etag") && function_exists("http_match_modified") )
{
    if ( 
http_match_etag($etag) || http_match_modified($file_last_modified) )
    {
        
header"HTTP/1.1 304 Not Modified" );
        exit;
    }
}

/**
 *    Extract the directory, file name and file
 *    extension from the "uri" parameter.
 */

$uri_dir "";
$file_name "";
$content_type "";

$uri_parts explode"/"$src_uri );

for ( 
$i 0$i count($uri_parts) - 1$i++ )
    
$uri_dir .= $uri_parts[$i] . "/";

$file_name end$uri_parts );

$file_parts explode"."$file_name );
if ( 
count($file_parts) > )
{
    
$file_extension end$file_parts );
    
$content_type $known_content_types[$file_extension];
}

/**
 *    Get the target file.
 *    If the browser accepts gzip encoding, the target file
 *    will be the gzipped version of the requested file.
 */

$dst_uri $dirname $src_uri;

$compress true;

/**
 *    Let's compress only text files...
 */

$compress $compress && ( strpos($content_type"text") !== false );

/**
 *    Finally, see if the client sent us the correct Accept-encoding: header value...
 */

$compress $compress && ( strpos($_SERVER["HTTP_ACCEPT_ENCODING"], "gzip") !== false );

if ( 
$compress )
{
    
$gz_uri $dirname '/_cache/gzip' $src_uri '.gz';

    if ( 
file_exists($gz_uri) )
    {
        
$src_last_modified filemtime$dirname $src_uri );
        
$dst_last_modified filemtime$gz_uri );

        
/**
         *    The gzip version of the file exists, but it is older
         *    than the source file. We need to recreate it...
         */
        
if ( $src_last_modified $dst_last_modified )
            
unlink$gz_uri );
    }

    if ( !
file_exists($gz_uri) )
    {
        if ( !
file_exists($dirname '/_cache/gzip' $uri_dir) )
            
mkdir_r$dirname '/_cache/gzip' $uri_dir );

        
$error false;

        
/**
         *    Output a gzipped minified javascript version of the input file
         */
        
if ( strpos($content_type"javascript") !== false )
        {
            require_once 
dirname__file__ ) . '/_moteur/jsmin.php';

            if ( 
$fp_out gzopen($gz_uri"wb") )
            {
                if ( 
$data file_get_contents($dirname $src_uri) )
                {
                    
gzwrite$fp_outJSMin::minify($data) );
                    
gzclose$fp_out );
                }
                else
                {
                    
$error true;
                }
            }
            else
            {
                
$error true;
            }
        }

        
/**
         *    Output a gzipped minified css version of the input file
         */  
elseif ( strpos($content_type"css") !== false )
        {
            require_once 
dirname__file__ ) . '/_moteur/cssmin.php';

            if ( 
$fp_out gzopen($gz_uri"wb") )
            {
                if ( 
$data file_get_contents($dirname $src_uri) )
                {
                    
gzwrite$fp_outcssmin::minify($data) );
                    
gzclose$fp_out );
                }
                else
                {
                    
$error true;
                }
            }
            else
            {
                
$error true;
            }
        }

        
/**
         *    Output a gzipped text version of the input file
         */
        
else
        {
            if ( 
$fp_out gzopen($gz_uri"wb") )
            {
                if ( 
$data file_get_contents($dirname $src_uri) )
                {
                    
gzwrite$fp_out$data );
                    
gzclose$fp_out );
                }
                else
                {
                    
$error true;
                }
            }
            else
            {
                
$error true;
            }
        }
        if ( !
$error )
        {
            
$dst_uri $gz_uri;
            
header"Content-Encoding: gzip" );
        }
    }
    else
    {
        
$dst_uri $gz_uri;
        
header"Content-Encoding: gzip" );
    }
}
/**
 *    Output the target file and set the appropriate HTTP headers.
 */
if ( $content_type )
    
header"Content-Type: " $content_type );

header"Content-Length: " filesize($dst_uri) );

readfile$dst_uri );

ob_end_flush();
?>
Brut de décoffrage, je remettrais en forme sous peu 34

PS: Ton fichier fera 30 mo 34
Je cerne pas l'intérêt par rapport à :
Code PHP :
ob_start("ob_gzhandler"); 
En effet syndrom, c'était un abus de langage de ma part 16
Au niveau de la limitation, celle-ci devrait passer à 6 sous firefox 3 et ie8, mais bon je pense que l'intérêt est toujours présent...
Sephi-Chan a écrit :Je cerne pas l'intérêt par rapport à :
Code PHP :
ob_start("ob_gzhandler"); 

* Contrôler que le fichier est ou n'est pas plus récent que la version en cache chez le client, pour économiser la bande passante.
* Stocker un fichier déjà g-zippé sur le serveur pour économiser des ressources.
* Minifier les fichiers CSS pour économiser de la bande passante.
* Minifier les fichiers Javascript pour pouvoir travailler plus simplement et économiser de la bande passante.

Sur environ 140ko, la page passe à 40ko environ, et ne renvoi que les fichiers non cachés chez le client, plus vieux que 300 jours, ou ayant été mis à jour sur le serveur.

Pour la minification :
http://code.google.com/p/jsmin-php/
http://code.google.com/p/cssmin/
En parlant de CDN, Google vient de lancer un service assez sympa bien que limité :
http://code.google.com/apis/ajaxlibs/
C'est un CDN qui distribue n'importe quelle version de n'importe quel framework javascript avec les avantages que cela implique :
Les librairies sont gzippés, minifiés, toujours à jours, et envoyé d'un server géographiquement proche de l'utilisateur 2
question :

j'ai actuellement un dédié sous ovh et j'ai un serveur mutualisé chez one que j'utilise très peu. Si je mets mes images sur le serveur mutualisé, est-ce que cela va réellement alléger mon serveur ET augmenter la vitesse d'affichage de mes pages ?
Pages : 1 2
URLs de référence