Store Framework vs FastStore: comparativo tecnico completo
O ecossistema VTEX oferece duas opcoes de frontend para lojas: Store Framework (construido sobre VTEX IO) e FastStore (construido sobre Next.js). Ambos servem o mesmo proposito - renderizar a experiencia de compra - mas com filosofias radicalmente diferentes. O Store Framework prioriza configurabilidade e ecossistema. O FastStore prioriza performance e controle. Entender as diferencas tecnicas entre eles e essencial para tomar a decisao certa para a sua operacao.
Arquitetura do Store Framework
O Store Framework funciona com blocos declarativos em JSON. Cada pagina e composta por blocos como header, slider-layout, shelf, product-summary, search-result-layout e footer. Cada bloco aceita propriedades (props) que configuram seu comportamento e aparencia. A tematizacao acontece via CSS Handles: seletores CSS expostos por cada bloco que permitem customizacao visual sem alterar o codigo fonte do componente. Os blocos sao distribuidos como apps VTEX IO. Isso significa que a comunidade e a propria VTEX publicam novos componentes que podem ser instalados via CLI (vtex install) ou pelo admin. O build acontece no servidor VTEX: o desenvolvedor roda vtex link para preview e vtex deploy para publicar. O resultado e um bundle React server-side rendered, mas com hydration completa no client, o que frequentemente gera bundles pesados.
Arquitetura do FastStore
O FastStore e um projeto Next.js com uma camada de componentes e utilitarios especificos para VTEX. O desenvolvedor trabalha com React puro, TypeScript e Tailwind CSS (ou CSS Modules). Nao existem blocos declarativos: cada pagina e um componente React que busca dados via GraphQL ou REST e renderiza HTML diretamente. O build acontece localmente ou em CI/CD (Vercel, GitHub Actions). O deploy pode ser feito na infraestrutura VTEX (WebOps) ou em qualquer provedor compativel com Next.js. O resultado e paginas server-rendered com hydration seletiva, bundles minimos e cache agressivo no edge. A diferenca pratica: enquanto no Store Framework voce configura, no FastStore voce codifica. O trade-off e mais controle vs mais trabalho.
Performance: numeros reais
Em testes com lojas reais, Store Framework tipicamente entrega Lighthouse scores entre 40 e 70 dependendo do numero de apps instaladas e da complexidade da pagina. O principal gargalo e o tamanho do bundle JavaScript: cada app instalada adiciona codigo ao bundle, e lojas com 20+ apps facilmente ultrapassam 1MB de JS. O FastStore entrega consistentemente scores entre 85 e 100. O segredo e a ausencia de apps de terceiros no bundle: cada funcionalidade e implementada como codigo dentro do projeto, permitindo tree-shaking, code splitting e lazy loading granulares. Em termos de Core Web Vitals: LCP no FastStore tipicamente fica abaixo de 1.5s (vs 3-5s no Store Framework). CLS e consistentemente zero quando dimensoes de imagem sao definidas. INP fica abaixo de 100ms pela ausencia de JavaScript pesado no main thread.
Ecossistema e funcionalidades
O Store Framework tem vantagem clara em ecossistema. Centenas de apps prontas para instalar: reviews, wishlists, product customizer, subscription, live shopping, chatbots, A/B testing e dezenas mais. Instalar uma app e tao simples quanto vtex install vendor.app-name. No FastStore, cada funcionalidade precisa ser implementada manualmente ou via SDK dedicado. Nao existe um marketplace de componentes visuais. Se a operacao precisa de funcionalidades como subscription, gift card, live shopping ou product customizer, o Store Framework oferece solucoes prontas. No FastStore, essas funcionalidades exigem desenvolvimento customizado consumindo APIs diretamente.
Experiencia de desenvolvimento (DX)
No Store Framework, o workflow e: editar JSON de blocos, rodar vtex link, visualizar mudancas no workspace, promover para producao via vtex deploy. A curva de aprendizado e moderada para quem ja conhece React, mas alta para quem nunca trabalhou com o sistema de blocos. A documentacao e extensa mas fragmentada. No FastStore, o workflow e: editar componentes React/TypeScript, rodar npm run dev para preview local, fazer push para o repositorio e o CI/CD cuida do deploy. A experiencia e identica a de qualquer projeto Next.js moderno. Desenvolvedores com experiencia em React se sentem em casa imediatamente. A documentacao e mais nova e menos abrangente, mas a familiaridade com Next.js compensa.
Caminhos de migracao
Migrar de Store Framework para FastStore nao e um upgrade simples. E uma reconstrucao do frontend. O backend VTEX permanece o mesmo: checkout, catalogo, precos, estoque e pedidos continuam funcionando normalmente. Mas toda a camada visual precisa ser reescrita. O processo tipico envolve: levantamento de funcionalidades do tema atual, priorizacao do que sera replicado vs descartado, desenvolvimento do novo frontend em FastStore, configuracao de APIs e integracao com o backend existente, QA comparativo entre versoes e go-live com monitoramento. O prazo medio e de 2 a 4 meses para lojas de complexidade padrao. O investimento parte de R$ 30 mil. Nao migre se a loja esta estavel e performando bem. Migre se a divida tecnica e insustentavel, se performance e prioridade estrategica ou se a loja esta sendo reconstruida de qualquer forma.
Quando escolher cada um
Escolha Store Framework se: a operacao depende de apps que nao existem no FastStore, o time e experiente em blocos e CSS Handles, o orcamento nao permite reconstrucao, ou a loja esta funcionando bem e nao tem problemas criticos de performance. Escolha FastStore se: performance e prioridade numero um, o time domina React e Next.js, a operacao esta comecando do zero, a loja tem problemas graves de performance que otimizacao pontual nao resolve, ou o projeto exige controle total sobre o HTML/CSS/JS gerado. Em ambos os casos, o backend VTEX e o mesmo. A escolha e exclusivamente sobre como o frontend e construido e entregue ao usuario final.