# GoHighLevel (GHL) — Otimizações Específicas

## Limitações (fora do nosso controle)

| Elemento | Impacto TBT | Solução |
|----------|-------------|---------|
| Google Tag Manager | +100-150ms | Nenhuma |
| TikTok Pixel (se ativo) | +50-100ms | Nenhuma |
| GHL tracking scripts | +50ms | Nenhuma |
| GHL CSS (leadconnectorhq.com) | +800-1400ms TBT desktop | Nenhuma |
| Template containers | CLS | GHL Full-Screen Fix JS |

**TBT mínimo esperado:** ~250-350ms (mesmo com HTML perfeito)
**Score máximo realista mobile:** 78-87

---

## GHL Full-Screen Fix (v2 — validado)

```js
(function() {
    function applyFix() {
        var root = document.querySelector('.PREFIX-root');
        if (!root) return;
        if (root.parentElement !== document.body) {
            var placeholder = document.createElement('div');
            placeholder.style.display = 'none';
            root.parentElement.insertBefore(placeholder, root);
            document.body.insertBefore(root, document.body.firstChild);
        }
        document.body.style.margin = '0';
        document.body.style.padding = '0';
        document.body.style.overflow = 'hidden auto';
        Array.prototype.forEach.call(document.body.children, function(el) {
            if (el !== root) el.style.display = 'none';
        });
    }
    var root = document.querySelector('.PREFIX-root');
    if (root && root.parentElement === document.body) {
        applyFix();
    } else {
        requestAnimationFrame(function() { requestAnimationFrame(applyFix); });
    }
})();
```

Substituir `PREFIX` pelo prefixo do projeto (3-4 letras).

---

## Restrições do Custom Code

- Sem controle do `<head>` — `<link>` funciona em qualquer lugar do DOM
- `media="print" onload` trick funciona sem `<head>`
- `preconnect` funciona em qualquer lugar no DOM
- Prefixar TODAS as classes CSS para evitar conflito com GHL

## Otimizações obrigatórias no GHL

1. GHL Full-Screen Fix com double `requestAnimationFrame`
2. Prefixar todas as classes (ex: `oap-`, `flb-`)
3. `media="print" onload` para fontes
4. Hero image < 200KB (WebP obrigatório)
5. Settings GHL: habilitar "Optimize Javascript"
6. Lazy-load widgets não-essenciais
7. Minificar CSS e JS inline

## Desktop vs Mobile

Desktop tende a ter TBT muito maior (+1000ms) por causa do GHL CSS externo. Isso é **normal** e não indica problema no nosso HTML. Mobile é a métrica relevante para score. Não tocar no código tentando melhorar desktop ou vai regredir o mobile.
