Para garantir o correto funcionamento das vitrines de recomendação em e-commerces desenvolvidos com a linguagem de programação React, é necessário realizar a inclusão prévia dos containers correspondentes a cada vitrine que será exibida no site.
Esses containers atuam como pontos de renderização na interface, permitindo que o sistema identifique a posição correta dentro da página para carregar dinamicamente os produtos recomendados. Sem essa estrutura previamente definida no código da aplicação, as vitrines não conseguirão ser exibidas corretamente.
Dessa forma, para viabilizar a implementação e assegurar o carregamento adequado das recomendações, é necessário inserir no código da aplicação os containers listados abaixo, respeitando as páginas e posições recomendadas para cada vitrine instalada no site.
| Container | Página | Tipo de Recomendação | Título | Posição Recomendada |
| performa-emptysearch1 | Página sem resultado de busca | Recomendação de produtos relacionados ao termo pesquisado pelo usuário. | O que você procura está aqui? | Primeiro elemento da página |
| performa-emptysearch2 | Página sem resultado de busca | Recomendações personalizadas com base no histórico de navegação do cliente. Disponível após o usuário acessar ao menos uma página de produto. | Recomendações para você | Segundo elemento da página |
| performa-emptysearch3 | Página sem resultado de busca | Exibição dos produtos mais vendidos nos últimos 30 dias. | Os mais vendidos | Terceiro elemento da página |
| performa-homep1 | Home | Recomendações personalizadas baseadas no histórico de navegação do cliente. Disponível após o usuário acessar ao menos uma página de produto. | Recomendações para você | Abaixo do primeiro banner |
| performa-homep2 | Home | Exibe os produtos mais clicados do site, considerando o maior volume de interações. | O que os outros estão vendo | Abaixo do segundo banner |
| performa-product1 | Produto | Exibe os produtos mais clicados do site, considerando o maior volume de interações. | O que os outros estão vendo | Abaixo da descrição do produto |
| performa-product2 | Produto | Power Infinity – Vitrine de recomendação infinita. Ordem de exibição: produtos similares ao item visualizado → mais vendidos → mais clicados → todos os produtos em estoque. | Você precisa ver esses produtos | Último elemento da página, acima do rodapé institucional |
| performa-category1 | Categoria | Recomenda os produtos mais vendidos da categoria acessada. Disponível apenas se o XML enviar corretamente as informações de categoria. Indicado para categorias com grande volume de produtos. | Os melhores produtos | Primeiro elemento da página, abaixo dos filtros |
| performa-category2 | Categoria | Exibe os produtos mais vendidos de todo o site. | Os mais vendidos | Final da página, após a listagem de produtos da categoria |
| performa-emptycart-1 | Carrinho vazio | Recomendações personalizadas com base no histórico de navegação do cliente. Disponível após o usuário acessar ao menos uma página de produto. | Recomendações para você | Primeiro elemento da página |
| performa-emptycart-2 | Carrinho vazio | Exibe os produtos mais vendidos de todo o site. | Os mais vendidos | Segundo elemento da página |
| performa-error1 | Página 404 | Exibe os produtos mais vendidos de todo o site. | Os mais vendidos | Primeiro elemento da página |