Imagem do banner da categoria demora para carregar

[NoamH (Noam Huri)]

@awesomerobot

.category-title-header {
  &.category-banner-example-category {
        background: url(example.jpg);
  }
}

Usei este CSS, mas as imagens levam 3 segundos para carregar (o tamanho da imagem é 240k)
Alguma sugestão?

[Canapin (Coin-coin le Canapin)]

Oi Noam, desculpe pela resposta tardia, estou revisando o tópico principal de category-banners e há algumas perguntas sem resposta que estou movendo para tópicos dedicados

Você conseguiu resolver o problema no final?

[NoamH (Noam Huri)]

Não, o primeiro upload ainda leva 3 segundos.

[Lilly (Lillian Louis)]

@NoamH

Usei este CSS, mas as imagens levam 3 segundos para carregar (o tamanho da imagem é 240k)
Alguma sugestão?

hmmm

você já tentou carregar a imagem como um recurso, fazendo upload para um tema (ou componente de tema) e usando uma variável como esta?

.category-title-header {
  &.category-banner-example-category {
        background: url($example);
  }
}

[NoamH (Noam Huri)]

Sim, este é o código do nosso lado:

.category-title-header.category-banner-show-and-tell {background-size: cover !important; background: url(https://cdck-file-uploads-europe1.s3.dualstack.eu-west-1.amazonaws.com/business20/uploads/algosec/original/1X/b94301fb225b079d905143074e33c5140e151f19.png); }

[awesomerobot (Kris)]

Não há nada inerente em adicionar uma imagem de fundo como esta que deva torná-la lenta, então é difícil dizer. Outras imagens estão carregando lentamente?

A imagem poderia ser otimizada um pouco mais para reduzir o tamanho do arquivo, ela não parece ter nenhuma transparência, então um JPG poderia ser menor que um PNG. Você também pode otimizá-la ainda mais usando uma ferramenta como ImageOptim (Mac) ou uma ferramenta baseada na web como TinyPNG.