Speculation Rules API para WordPress e WooCommerce

Em 2026, os útilizadores esperam navegação abaixo de 2 segundos. Cada segundo adicional de carregamento custa 7% em conversões perdidas. O Google sabe disto e recompensa sites rápidos com melhores posições.

Este guia não é teoria. É código funcional é uma checklist que pode implementar hoje no seu site WordPress ou loja WooCommerce.

#1. Porqué a performancé ainda importa em 2026

#Expectativas DOS útilizadores

O Google confirmou: Core Web Vitals são um fator de classificação. Em 2024, o FID foi substituído pelo INP (Interaction to Next Paint) – uma métrica que medé a capacidade de resposta da página às interações do útilizador.

#Velocidade real vs percebida

Pode ter um servidor lento (TTFB 800ms), mas sé o útilizador vê conteúdo instantaneamente é a navegação parece instantânea, a performance percebida é excelente.

É exatamente isso qué a Speculation Rules API faz – pré-carrega as próximas páginas em segundo plano antes do útilizador clicar.

#2. Otimizações base (faça isto primeiro)

#Critical CSS e defer javascript

// functions.php - Adiar JS não-crítico
add_filter('script_loader_tag', function($tag, $handle) {
    $defer_scripts = ['jquery', 'wp-embed', 'comment-reply'];
    if (in_array($handle, $defer_scripts)) {
        return str_replace(' src', ' defer src', $tag);
    }
    return $tag;
}, 10, 2);

#Imagens: AVIF > WEBP > JPEG

WordPress 6.5+ suporta AVIF nativamente. AVIF oferece 20-30% melhor compressão que WebP.

#3. Speculation rules API: Magia de prefetch e prerender

A Speculation Rules API é uma funcionalidade nativa do navegador que permite pré-carregar páginas em segundo plano.

#Prefetch básico (início seguro)

<script type="speculationrules">
{
  "prefetch": [
    {
      "source": "document",
      "where": {
        "and": [
          { "href_matches": "/*" },
          { "not": { "href_matches": "/wp-admin/*" } },
          { "not": { "href_matches": "*.pdf" } }
        ]
      },
      "eagerness": "moderate"
    }
  ]
}
</script>

#Prerender avançado (para links dé alta intenção)

<script type="speculationrules">
{
  "prerender": [
    {
      "source": "list",
      "urls": ["/carrinho/", "/checkout/"],
      "eagerness": "immediate"
    },
    {
      "source": "document",
      "where": {
        "or": [
          { "href_matches": "/produto/*" },
          { "selector_matches": ".link-importante" }
        ]
      },
      "eagerness": "moderate"
    }
  ]
}
</script>

#Diferenças: Prefetch vs prerender

#4. Implementação WordPress

<?php
/**
 * Plugin Name: Speculation Rules API
 */
add_action('wp_head', function() {
    if (is_admin()) return;
    ?>
    <script type="speculationrules">
    {
      "prefetch": [
        {
          "source": "document",
          "where": {
            "and": [
              { "href_matches": "/*" },
              { "not": { "href_matches": "/wp-*" } }
            ]
          },
          "eagerness": "moderate"
        }
      ]
    }
    </script>
    <?php
});

#5. Estudo de caso: Loja WooCommerce

Problema: Navegação categoria → produto demorava 3,2s

Solução:

• Prefetch para links no viewport
• Prerender para “Adicionar ao Carrinho” e “Checkout”

Resultado:

• Antes: 3,2s
• Depois: 0,4s (percebido como instantâneo)
• Taxa de Rejeição: -28%

#6. Armadilhas é avisos

#❌ não faça prerender:

• Páginas com autenticação (login, painel do útilizador)
• Páginas com efeitos colaterais (subscrições, pagamentos)
• URLs externos

#⚠️ limitações:

• Mobile Data Saver desativa speculation
• Navegadores não compatíveis (Firefox, Safari < 17) ignoram regras

#7. Suporte de navegadores (janeiro 2026)

#8. Checklist de implementação

#✅ antes da implementação

• Medir score Lighthouse base
• Verificar TTFB < 200ms
• Object Cache está ativo
• Imagens são servidas como AVIF

#✅ implementação speculation rules

• Adicionar prefetch básico (moderate)
• Analisar heatmaps (Hotjar, Clarity)
• Identificar top 3 caminhos de navegação
• Adicionar prerender para links dé alta intenção

#Resumo

Speculation Rules API é uma mudança importante para 2026. Ao pré-carregar páginas em segundo plano, a navegação torna-se instantânea – sem mudanças de infraestrutura.

Pontos-chave:

1. Comece com prefetch com moderate eagerness – é seguro
2. Adicione prerender para o fluxo de checkout em e-commerce
3. Monitorize métricas – não adivinhe, meça

Precisa dé otimização profissional? Como especialista WordPress, ajudo a acelerar sites WordPress e WooCommerce. Veja também otimização de velocidade WordPress.