Drupal Performance
Dicas e técnicas para levar seu Drupal às nuvens




Drupalcamp São Paulo 2013
  by Paulino Michelazzo
Por quê WPO?
  web performance optimization
57% dos
                      43%
visitantes de sites
de viagens saem                       57%

após 3 segundos
       25% mobile




                            3 sec
                            > 3 sec
1 segundo é...




   - 7%        - 11%       - 16%
conversões   pageviews   satisfação
1.6 bilhões de dólares em
      vendas anuais
25% de acréscimo em pageviews
 7 a 12% aumento nas vendas
  50% de redução de hardware
tempo é dinheiro
definindo
performance
é lento ou está lento?
O Drupal é lento?

         Não!
         Desenvolvedores e
         e designers o
         tornam lento
1ª regra

definir se o website é lento
   ou se ele está lento
o que é lento?
aquilo que impacta na
conversão de usuários
Top 300K
  14%       86%


    1.6               10.9


 backend   frontend
2ª regra
  80 a 90% das
lesmas estão no
    front-end


          Mate-as antes
80 ~ 90% no Drupal
    tema
• Arquivos JavaScript
• Arquivos CSS
• Imagens
• Requisições HTTP
• DNS Lookup’s
3 arquivos




       ativar



1 arquivo
JavaScript

• Colocá-los no fim do código
• Minificar arquivos
• Carregar arquivos externos
  assincronamente

• Combinar arquivos
Carga assíncrona
var script = document.createElement('script'),
    scripts = document.getElementsByTagName('script')[0];
script.async = true;
script.src = url;
scripts.parentNode.insertBefore(script, scripts);
FiF - frame in frame
(function() {
  var url = 'http://example.org/js.js';
  var iframe = document.createElement('iframe');
  (iframe.frameElement || iframe).style.cssText =
    "width: 0; height: 0; border: 0";
  iframe.src = "javascript:false";
  var where = document.getElementsByTagName('script')[0];
  where.parentNode.insertBefore(iframe, where);
  var doc = iframe.contentWindow.document;
  doc.open().write('<body onload="'+
    'var js = document.createElement('script');'+
    'js.src = ''+ url +'';'+
    'document.body.appendChild(js);">');
  doc.close();
}());

         https://www.facebook.com/note.php?
            note_id=10151176218703920
8 arquivos




       ativar




3 arquivos
Apelando...

function hook_css_alter(&$css) {
  // Remove defaults.css file.
  unset($css[drupal_get_path('module','system')'/defaults.css']);
}
CSS

• Colocá-los no início do código
• Minificar arquivos
• Fugir de @import
• Combinar arquivos
Imagens




98k             25k

       73k
Imagens


      51.1k
53k             1.9k


       97%
Imagens

• JPG               DPI não se usa em

 • Progressivas         monitor!!!


 • Qualidade
• PNG
 • Indexadas
requisições HTTP

• Não fazer
• Não fazer
• Precisa fazer, reduza
 • (menos css, menos js, menos imagens)
o terror da requisição



404
DNS Lookup’s

• Reduza
• Reduza
• Precisa mesmo? Traga para mais perto
 • perto = dentro
3ª regra
   10 e 20%
rede e servidor

        difícil, mas não
           impossível
tempo para 1º byte

       DNS lookup


     Conexão inicial


     Tempo de espera
10 ~ 20% no Drupal
cache
• APC - Alternative PHP Cache
 • cache de código PHP
• Memcached
 • cache banco e código
• Varnish
 • cache não-autenticado
boost


• Módulo que não depende de terceiros
  para funcionamento

• Alternativa ao Varnish
views
• views cache
 • basta ativar
• views litepager (drupal.org/project/
  views_litepager)

 • remove query COUNT
 • não apresenta nº total de páginas
 • não permite navegação para última
cache de blocos


• Reduz o tempo de carga de blocos
• Maravilhoso em conjunto com
  memcache
Tips & Tricks
• realpath_cache_size = 64K (monitore)
• query_cache_size = 128M
• query_cache_limit = 1M
Corram!!!!!

• Database logging (dblog)
• Statistics
• PHP filter
Last words

• Otimização é trabalhosa
 • mas o resultado vale a pena
• Otimização é experiência
 • combinar ingredientes e cenários
obrigado

      Paulino Michelazzo

     about.me/pmichelazzo

Drupal Performance - Dicas e técnicas para levar seu Drupal às nuvens

  • 1.
    Drupal Performance Dicas etécnicas para levar seu Drupal às nuvens Drupalcamp São Paulo 2013 by Paulino Michelazzo
  • 2.
    Por quê WPO? web performance optimization
  • 4.
    57% dos 43% visitantes de sites de viagens saem 57% após 3 segundos 25% mobile 3 sec > 3 sec
  • 5.
    1 segundo é... - 7% - 11% - 16% conversões pageviews satisfação
  • 6.
    1.6 bilhões dedólares em vendas anuais
  • 7.
    25% de acréscimoem pageviews 7 a 12% aumento nas vendas 50% de redução de hardware
  • 8.
  • 9.
  • 10.
    é lento ouestá lento?
  • 13.
    O Drupal élento? Não! Desenvolvedores e e designers o tornam lento
  • 14.
    1ª regra definir seo website é lento ou se ele está lento
  • 15.
    o que élento?
  • 16.
    aquilo que impactana conversão de usuários
  • 18.
    Top 300K 14% 86% 1.6 10.9 backend frontend
  • 19.
    2ª regra 80 a 90% das lesmas estão no front-end Mate-as antes
  • 20.
    80 ~ 90%no Drupal tema
  • 21.
    • Arquivos JavaScript •Arquivos CSS • Imagens • Requisições HTTP • DNS Lookup’s
  • 22.
    3 arquivos ativar 1 arquivo
  • 23.
    JavaScript • Colocá-los nofim do código • Minificar arquivos • Carregar arquivos externos assincronamente • Combinar arquivos
  • 24.
    Carga assíncrona var script= document.createElement('script'), scripts = document.getElementsByTagName('script')[0]; script.async = true; script.src = url; scripts.parentNode.insertBefore(script, scripts);
  • 25.
    FiF - framein frame (function() { var url = 'http://example.org/js.js'; var iframe = document.createElement('iframe'); (iframe.frameElement || iframe).style.cssText = "width: 0; height: 0; border: 0"; iframe.src = "javascript:false"; var where = document.getElementsByTagName('script')[0]; where.parentNode.insertBefore(iframe, where); var doc = iframe.contentWindow.document; doc.open().write('<body onload="'+ 'var js = document.createElement('script');'+ 'js.src = ''+ url +'';'+ 'document.body.appendChild(js);">'); doc.close(); }()); https://www.facebook.com/note.php? note_id=10151176218703920
  • 26.
    8 arquivos ativar 3 arquivos
  • 27.
    Apelando... function hook_css_alter(&$css) { // Remove defaults.css file. unset($css[drupal_get_path('module','system')'/defaults.css']); }
  • 28.
    CSS • Colocá-los noinício do código • Minificar arquivos • Fugir de @import • Combinar arquivos
  • 29.
    Imagens 98k 25k 73k
  • 30.
    Imagens 51.1k 53k 1.9k 97%
  • 31.
    Imagens • JPG DPI não se usa em • Progressivas monitor!!! • Qualidade • PNG • Indexadas
  • 32.
    requisições HTTP • Nãofazer • Não fazer • Precisa fazer, reduza • (menos css, menos js, menos imagens)
  • 33.
    o terror darequisição 404
  • 34.
    DNS Lookup’s • Reduza •Reduza • Precisa mesmo? Traga para mais perto • perto = dentro
  • 35.
    3ª regra 10 e 20% rede e servidor difícil, mas não impossível
  • 36.
    tempo para 1ºbyte DNS lookup Conexão inicial Tempo de espera
  • 38.
    10 ~ 20%no Drupal
  • 39.
    cache • APC -Alternative PHP Cache • cache de código PHP • Memcached • cache banco e código • Varnish • cache não-autenticado
  • 40.
    boost • Módulo quenão depende de terceiros para funcionamento • Alternativa ao Varnish
  • 41.
    views • views cache • basta ativar • views litepager (drupal.org/project/ views_litepager) • remove query COUNT • não apresenta nº total de páginas • não permite navegação para última
  • 42.
    cache de blocos •Reduz o tempo de carga de blocos • Maravilhoso em conjunto com memcache
  • 43.
  • 44.
    • realpath_cache_size =64K (monitore) • query_cache_size = 128M • query_cache_limit = 1M
  • 45.
    Corram!!!!! • Database logging(dblog) • Statistics • PHP filter
  • 46.
    Last words • Otimizaçãoé trabalhosa • mas o resultado vale a pena • Otimização é experiência • combinar ingredientes e cenários
  • 47.
    obrigado Paulino Michelazzo about.me/pmichelazzo