Dúvida sobre Performance de Apps

Fala Devs!

Até que ponto vocês utilizam os componentes nativos da VTEX durante o desenvolvimento de um app?

Por exemplo, no caso da exibição de imagens.

Vale a pena deixar de usar a tag <img /> e usar o componente Image disponível em vtex.store-image?

import { Image } from 'vtex.store-image'
import { useCustomClasses } from 'vtex.css-handles'

  const imageClasses = useCustomClasses(() => ({
    imageElement: `imageElement ${styles['one']} ${styles['two']}`,
  }))

<Image
  src={imagePath}
  alt={imageAlt}
  title={imageTitle}
  classes={imageClasses}
/>

Existe alguma vantagem de usar os componentes nativos inclusive para essas tarefas como exibir imagem, gerar links, etc?

Obrigado desde já!

Depende muito mas no geral sim.
O próprio caso citado do VTEX.store-image já conta com mecanicas preparadas para boas práticas de SEO, Analytics e desempenho, que tendem a melhorar. Eu pessoalmente prefiro usar o componente nativo, mantendo o fonte mais legivel e aproveitando o que já foi criado.

1 Like