Skip to main content
replaced http://pt.stackoverflow.com/ with https://pt.stackoverflow.com/
Fonte Link

Primeiramente quero que pense que tudo é RELATIVO e apenas experiencias de cada situação poderão determinar CASO á CASO qual terá melhor performance no seu projeto e servidor.

Existem dois ambientes/camadas que você tem que pensar, um é a renderização e o outro as requisições:

Renderização Front-End

A renderização no front-end pode começar a ocorrer, mesmo sem a página ter sido terminada de carregar, ou seja imagens podem começar a carregar e renderizar mesmo sem a página ter completado o download.

Pensando assim em questão da imagem estar em base64, poderá haver dois motivos que tornam mais lento:

  • O motor interno do browser ter que decodificar a imagem
  • Imagens base64 usando o protocolo (data URI scheme) data: aumentam o tamanho da página html em muito, o que torna a página mais lenta de ser renderizada.

Concluindo, protocolo data e base64 podem tornar a renderização e o download da página html mais lentos, mas você irá poupar requisições

Requisições no Back-End

Quantidade de requisições melhoram sim a performance, mas não do lado do front-end e sim do back-end, ou seja quanto menos requisições, provavelmente melhor performance, no entanto em caso do protocolo data: como citei antes, a página html será maior e então você também pode ter ainda sim uma nova elevação no consumo do servidor.

  • Conexões keep-alive

    Os navegadores tentam manter a conexão aberta quando estão requisitando itens de uma mesma página, assim se tiver várias imagens, provavelmente o navegador irá tentar diminuir as conexões (não as requisições), o que de certa forma já ajudaria. Mas note que nem sempre é possível reaproveitar a mesma conexão e que o browser irá se comportar exatamente assim, cada browser tem a sua própria maneira de fazer isto e vai tentar operar a situação conforme ele achar melhor.

    Leia mais em: https://en.wikipedia.org/wiki/HTTP_persistent_connection

Conclusão

Não tem como afirmar o qual vai ser mais rápido, no entanto eu recomendo você usar imagens estáticas com Cache e com o 304 Not Modified, veja esta pergunta minha:

Pois desta maneira você terá menos impacto no servidor quanto aos arquivos estáticos, já que as imagens virão do cache nas próximas requisições e ainda por cima irá fazer a página fazer o download mais rápido, isto não influencia diretamente no processo renderização, mas acredito que imagens estáticas sejam mais "fáceis" de renderizar para os browsers que as codificadas.

Primeiramente quero que pense que tudo é RELATIVO e apenas experiencias de cada situação poderão determinar CASO á CASO qual terá melhor performance no seu projeto e servidor.

Existem dois ambientes/camadas que você tem que pensar, um é a renderização e o outro as requisições:

Renderização Front-End

A renderização no front-end pode começar a ocorrer, mesmo sem a página ter sido terminada de carregar, ou seja imagens podem começar a carregar e renderizar mesmo sem a página ter completado o download.

Pensando assim em questão da imagem estar em base64, poderá haver dois motivos que tornam mais lento:

  • O motor interno do browser ter que decodificar a imagem
  • Imagens base64 usando o protocolo (data URI scheme) data: aumentam o tamanho da página html em muito, o que torna a página mais lenta de ser renderizada.

Concluindo, protocolo data e base64 podem tornar a renderização e o download da página html mais lentos, mas você irá poupar requisições

Requisições no Back-End

Quantidade de requisições melhoram sim a performance, mas não do lado do front-end e sim do back-end, ou seja quanto menos requisições, provavelmente melhor performance, no entanto em caso do protocolo data: como citei antes, a página html será maior e então você também pode ter ainda sim uma nova elevação no consumo do servidor.

  • Conexões keep-alive

    Os navegadores tentam manter a conexão aberta quando estão requisitando itens de uma mesma página, assim se tiver várias imagens, provavelmente o navegador irá tentar diminuir as conexões (não as requisições), o que de certa forma já ajudaria. Mas note que nem sempre é possível reaproveitar a mesma conexão e que o browser irá se comportar exatamente assim, cada browser tem a sua própria maneira de fazer isto e vai tentar operar a situação conforme ele achar melhor.

    Leia mais em: https://en.wikipedia.org/wiki/HTTP_persistent_connection

Conclusão

Não tem como afirmar o qual vai ser mais rápido, no entanto eu recomendo você usar imagens estáticas com Cache e com o 304 Not Modified, veja esta pergunta minha:

Pois desta maneira você terá menos impacto no servidor quanto aos arquivos estáticos, já que as imagens virão do cache nas próximas requisições e ainda por cima irá fazer a página fazer o download mais rápido, isto não influencia diretamente no processo renderização, mas acredito que imagens estáticas sejam mais "fáceis" de renderizar para os browsers que as codificadas.

Primeiramente quero que pense que tudo é RELATIVO e apenas experiencias de cada situação poderão determinar CASO á CASO qual terá melhor performance no seu projeto e servidor.

Existem dois ambientes/camadas que você tem que pensar, um é a renderização e o outro as requisições:

Renderização Front-End

A renderização no front-end pode começar a ocorrer, mesmo sem a página ter sido terminada de carregar, ou seja imagens podem começar a carregar e renderizar mesmo sem a página ter completado o download.

Pensando assim em questão da imagem estar em base64, poderá haver dois motivos que tornam mais lento:

  • O motor interno do browser ter que decodificar a imagem
  • Imagens base64 usando o protocolo (data URI scheme) data: aumentam o tamanho da página html em muito, o que torna a página mais lenta de ser renderizada.

Concluindo, protocolo data e base64 podem tornar a renderização e o download da página html mais lentos, mas você irá poupar requisições

Requisições no Back-End

Quantidade de requisições melhoram sim a performance, mas não do lado do front-end e sim do back-end, ou seja quanto menos requisições, provavelmente melhor performance, no entanto em caso do protocolo data: como citei antes, a página html será maior e então você também pode ter ainda sim uma nova elevação no consumo do servidor.

  • Conexões keep-alive

    Os navegadores tentam manter a conexão aberta quando estão requisitando itens de uma mesma página, assim se tiver várias imagens, provavelmente o navegador irá tentar diminuir as conexões (não as requisições), o que de certa forma já ajudaria. Mas note que nem sempre é possível reaproveitar a mesma conexão e que o browser irá se comportar exatamente assim, cada browser tem a sua própria maneira de fazer isto e vai tentar operar a situação conforme ele achar melhor.

    Leia mais em: https://en.wikipedia.org/wiki/HTTP_persistent_connection

Conclusão

Não tem como afirmar o qual vai ser mais rápido, no entanto eu recomendo você usar imagens estáticas com Cache e com o 304 Not Modified, veja esta pergunta minha:

Pois desta maneira você terá menos impacto no servidor quanto aos arquivos estáticos, já que as imagens virão do cache nas próximas requisições e ainda por cima irá fazer a página fazer o download mais rápido, isto não influencia diretamente no processo renderização, mas acredito que imagens estáticas sejam mais "fáceis" de renderizar para os browsers que as codificadas.

Fim da Recompensa com 100 pontos de reputação concedidos por Wallace Vizerra
adicionou 11 caracteres ao conteúdo
Fonte Link
Syzoth
  • 100,5mil
  • 23
  • 169
  • 361

Primeiramente quero que pense que tudo é RELATIVO e apenas experiencias de cada situação poderápoderão determinar CASO á CASO qual terá melhor performance no seu projeto e servidor.

Existem dois ambientes/camadas que você tem que pensar, um é a renderização e o outro as requisições:

Renderização Front-End

A renderização no front-end pode começar a ocorrer, mesmo sem a página ter sido terminada de carregar, ou seja imagens podem começar a carregar e renderizar mesmo sem a página ter completado o download.

Pensando assim em questão da imagem estar em base64, poderá haver dois motivos que tornam mais lento:

  • O motor interno do browser ter que decodificar a imagem
  • Imagens base64 usando o protocolo (data URI scheme) data: aumentam o tamanho da página html em muito, o que torna a página mais lenta de ser renderizada.

Concluindo, protocolo data e base64 podem tornar a renderização e o download da página html mais lentos, mas você irá poupar requisições

Requisições no Back-End

Quantidade de requisições melhoram sim a performance, mas não do lado do front-end e sim do back-end, ou seja quanto menos requisições, provavelmente melhor performance, no entanto em caso do protocolo data: como citei antes, a página html será maior e então você também pode ter ainda sim uma nova elevação no consumo do servidor.

  • Conexões keep-alive

    Os navegadores tentam manter a conexão aberta quando estão requisitando itens de uma mesma página, assim se tiver várias imagens, provavelmente o navegador irá tentar diminuir as conexões (não as requisições), o que de certa forma já ajudaria. Mas note que nem sempre é possível reaproveitar a mesma conexão e que o browser irá se comportar exatamente assim, cada browser tetem a sua própria inteligenciamaneira de fazer isto e vai tentar operar a situação conforme ele achar melhor.

    Leia mais em: https://en.wikipedia.org/wiki/HTTP_persistent_connection

Conclusão

Não tem como afirmar o qual vai ser mais rápido, no entanto eu recomendo você usar imagens estáticas com Cache e com o 304 Not Modified, veja esta pergunta minha:

Pois desta maneira você terá menos impacto no servidor quanto aos arquivos estáticos, já que as imagens virão do cache nas próximas requisições e ainda por cima irá fazer a página fazer o download mais rápido, isto não influencia diretamente no processo renderização, mas acredito que imagens estáticas sejam mais "fáceis" de renderizar para os browsers que as codificadas.

Primeiramente quero que pense que tudo é RELATIVO e apenas experiencias de cada situação poderá determinar CASO á CASO qual terá melhor performance no seu projeto e servidor.

Existem dois ambientes/camadas que você tem que pensar, um é a renderização e o outro as requisições:

Renderização Front-End

A renderização no front-end pode começar a ocorrer, mesmo sem a página ter sido terminada de carregar, ou seja imagens podem começar a carregar e renderizar mesmo sem a página ter completado o download.

Pensando assim em questão da imagem estar em base64, poderá haver dois motivos que tornam mais lento:

  • O motor interno do browser ter que decodificar a imagem
  • Imagens base64 usando o protocolo (data URI scheme) data: aumentam o tamanho da página html em muito, o que torna a página mais lenta de ser renderizada.

Concluindo, protocolo data e base64 podem tornar a renderização e o download da página html mais lentos, mas você irá poupar requisições

Requisições no Back-End

Quantidade de requisições melhoram sim a performance, mas não do lado do front-end e sim do back-end, ou seja quanto menos requisições, provavelmente melhor performance, no entanto em caso do protocolo data: como citei antes, a página html será maior e então você também pode ter ainda sim uma nova elevação no consumo do servidor.

  • Conexões keep-alive

    Os navegadores tentam manter a conexão aberta quando estão requisitando itens de uma mesma página, assim se tiver várias imagens, provavelmente o navegador irá tentar diminuir as conexões (não as requisições), o que de certa forma já ajudaria. Mas note que nem sempre é possível reaproveitar a mesma conexão e que o browser irá se comportar exatamente assim, cada browser te a sua própria inteligencia e vai tentar operar a situação conforme ele achar melhor.

    Leia mais em: https://en.wikipedia.org/wiki/HTTP_persistent_connection

Conclusão

Não tem como afirmar o qual vai ser mais rápido, no entanto eu recomendo você usar imagens estáticas com Cache e com o 304 Not Modified, veja esta pergunta minha:

Pois desta maneira você terá menos impacto no servidor quanto aos arquivos estáticos, já que as imagens virão do cache nas próximas requisições e ainda por cima irá fazer a página fazer o download mais rápido, isto não influencia diretamente no processo renderização, mas acredito que imagens estáticas sejam mais "fáceis" de renderizar para os browsers que as codificadas.

Primeiramente quero que pense que tudo é RELATIVO e apenas experiencias de cada situação poderão determinar CASO á CASO qual terá melhor performance no seu projeto e servidor.

Existem dois ambientes/camadas que você tem que pensar, um é a renderização e o outro as requisições:

Renderização Front-End

A renderização no front-end pode começar a ocorrer, mesmo sem a página ter sido terminada de carregar, ou seja imagens podem começar a carregar e renderizar mesmo sem a página ter completado o download.

Pensando assim em questão da imagem estar em base64, poderá haver dois motivos que tornam mais lento:

  • O motor interno do browser ter que decodificar a imagem
  • Imagens base64 usando o protocolo (data URI scheme) data: aumentam o tamanho da página html em muito, o que torna a página mais lenta de ser renderizada.

Concluindo, protocolo data e base64 podem tornar a renderização e o download da página html mais lentos, mas você irá poupar requisições

Requisições no Back-End

Quantidade de requisições melhoram sim a performance, mas não do lado do front-end e sim do back-end, ou seja quanto menos requisições, provavelmente melhor performance, no entanto em caso do protocolo data: como citei antes, a página html será maior e então você também pode ter ainda sim uma nova elevação no consumo do servidor.

  • Conexões keep-alive

    Os navegadores tentam manter a conexão aberta quando estão requisitando itens de uma mesma página, assim se tiver várias imagens, provavelmente o navegador irá tentar diminuir as conexões (não as requisições), o que de certa forma já ajudaria. Mas note que nem sempre é possível reaproveitar a mesma conexão e que o browser irá se comportar exatamente assim, cada browser tem a sua própria maneira de fazer isto e vai tentar operar a situação conforme ele achar melhor.

    Leia mais em: https://en.wikipedia.org/wiki/HTTP_persistent_connection

Conclusão

Não tem como afirmar o qual vai ser mais rápido, no entanto eu recomendo você usar imagens estáticas com Cache e com o 304 Not Modified, veja esta pergunta minha:

Pois desta maneira você terá menos impacto no servidor quanto aos arquivos estáticos, já que as imagens virão do cache nas próximas requisições e ainda por cima irá fazer a página fazer o download mais rápido, isto não influencia diretamente no processo renderização, mas acredito que imagens estáticas sejam mais "fáceis" de renderizar para os browsers que as codificadas.

adicionou 64 caracteres ao conteúdo
Fonte Link
Syzoth
  • 100,5mil
  • 23
  • 169
  • 361

Primeiramente quero que pense que tudo é RELATIVO e apenas experiencias de cada situação poderá determinar CASO á CASO qual terá melhor performance no seu projeto e servidor.

Existem dois ambientes/camadas que você tem que pensar, um é a renderização e o outro as requisições:

Renderização Front-End

A renderização no front-end pode começar a ocorrer, mesmo sem a página ter sido terminada de carregar, ou seja imagens podem começar a carregar e renderizar mesmo sem a página ter completado o download.

Pensando assim em questão da imagem estar em base64, poderá haver dois motivos que tornam mais lento:

  • O motor interno do browser ter que decodificar a imagem
  • Imagens base64 usando o protocolo (data URI scheme) data: aumentam o tamanho da página html em muito, o que torna a página mais lenta de ser renderizada.

Concluindo, protocolo data e base64 podem tornar a renderização e o download da página html mais lentos, mas você irá poupar requisições

Requisições no Back-End

Quantidade de requisições melhoram sim a performance, mas não do lado do front-end e sim do back-end, ou seja quanto menos requisições, provavelmente melhor performance, no entanto em caso do protocolo data: como citei antes, a página html será maior e então você também pode ter ainda sim uma nova elevação no consumo do servidor.

Conexões keep-alive

Os navegadores tentam manter a conexão aberta quando estão requisitando itens de uma mesma página, assim se tiver várias imagens, provavelmente o navegador irá tentar diminuir as conexões (não as requisições), o que de certa forma já ajudaria. Mas note que nem sempre é possível reaproveitar a mesma conexão e que o browser irá se comportar exatamente assim, cada browser te a sua própria inteligencia e vai tentar operar a situação conforme ele achar melhor.

Leia mais em: https://en.wikipedia.org/wiki/HTTP_persistent_connection

  • Conexões keep-alive

    Os navegadores tentam manter a conexão aberta quando estão requisitando itens de uma mesma página, assim se tiver várias imagens, provavelmente o navegador irá tentar diminuir as conexões (não as requisições), o que de certa forma já ajudaria. Mas note que nem sempre é possível reaproveitar a mesma conexão e que o browser irá se comportar exatamente assim, cada browser te a sua própria inteligencia e vai tentar operar a situação conforme ele achar melhor.

    Leia mais em: https://en.wikipedia.org/wiki/HTTP_persistent_connection

Conclusão

Não tem como afirmar o qual vai ser mais rápido, no entanto eu recomendo você usar imagens estáticas com Cache e com o 304 Not Modified, veja esta pergunta minha:

Pois desta maneira você terá menos impacto no servidor quanto aos arquivos estáticos, já que as imagens virão do cache nas próximas requisições e ainda por cima irá fazer a página fazer o download mais rápido, isto não influencia diretamente no processo renderização, mas acredito que imagens estáticas sejam mais "fáceis" de renderizar para os browsers que as codificadas.

Primeiramente quero que pense que tudo é RELATIVO e apenas experiencias de cada situação poderá determinar CASO á CASO qual terá melhor performance no seu projeto e servidor.

Existem dois ambientes que você tem que pensar:

Renderização Front-End

A renderização no front-end pode começar a ocorrer, mesmo sem a página ter sido terminada de carregar, ou seja imagens podem começar a carregar e renderizar mesmo sem a página ter completado o download.

Pensando assim em questão da imagem estar em base64, poderá haver dois motivos que tornam mais lento:

  • O motor interno do browser ter que decodificar a imagem
  • Imagens base64 usando o protocolo (data URI scheme) data: aumentam o tamanho da página html em muito, o que torna a página mais lenta de ser renderizada.

Concluindo, protocolo data e base64 podem tornar a renderização e o download da página html mais lentos, mas você irá poupar requisições

Requisições no Back-End

Quantidade de requisições melhoram sim a performance, mas não do lado do front-end e sim do back-end, ou seja quanto menos requisições, provavelmente melhor performance, no entanto em caso do protocolo data: como citei antes, a página html será maior e então você também pode ter ainda sim uma nova elevação no consumo do servidor.

Conexões keep-alive

Os navegadores tentam manter a conexão aberta quando estão requisitando itens de uma mesma página, assim se tiver várias imagens, provavelmente o navegador irá tentar diminuir as conexões (não as requisições), o que de certa forma já ajudaria. Mas note que nem sempre é possível reaproveitar a mesma conexão e que o browser irá se comportar exatamente assim, cada browser te a sua própria inteligencia e vai tentar operar a situação conforme ele achar melhor.

Leia mais em: https://en.wikipedia.org/wiki/HTTP_persistent_connection

Conclusão

Não tem como afirmar o qual vai ser mais rápido, no entanto eu recomendo você usar imagens estáticas com Cache e com o 304 Not Modified, veja esta pergunta minha:

Pois desta maneira você terá menos impacto no servidor quanto aos arquivos estáticos, já que as imagens virão do cache nas próximas requisições e ainda por cima irá fazer a página fazer o download mais rápido, isto não influencia diretamente no processo renderização, mas acredito que imagens estáticas sejam mais "fáceis" de renderizar para os browsers que as codificadas.

Primeiramente quero que pense que tudo é RELATIVO e apenas experiencias de cada situação poderá determinar CASO á CASO qual terá melhor performance no seu projeto e servidor.

Existem dois ambientes/camadas que você tem que pensar, um é a renderização e o outro as requisições:

Renderização Front-End

A renderização no front-end pode começar a ocorrer, mesmo sem a página ter sido terminada de carregar, ou seja imagens podem começar a carregar e renderizar mesmo sem a página ter completado o download.

Pensando assim em questão da imagem estar em base64, poderá haver dois motivos que tornam mais lento:

  • O motor interno do browser ter que decodificar a imagem
  • Imagens base64 usando o protocolo (data URI scheme) data: aumentam o tamanho da página html em muito, o que torna a página mais lenta de ser renderizada.

Concluindo, protocolo data e base64 podem tornar a renderização e o download da página html mais lentos, mas você irá poupar requisições

Requisições no Back-End

Quantidade de requisições melhoram sim a performance, mas não do lado do front-end e sim do back-end, ou seja quanto menos requisições, provavelmente melhor performance, no entanto em caso do protocolo data: como citei antes, a página html será maior e então você também pode ter ainda sim uma nova elevação no consumo do servidor.

  • Conexões keep-alive

    Os navegadores tentam manter a conexão aberta quando estão requisitando itens de uma mesma página, assim se tiver várias imagens, provavelmente o navegador irá tentar diminuir as conexões (não as requisições), o que de certa forma já ajudaria. Mas note que nem sempre é possível reaproveitar a mesma conexão e que o browser irá se comportar exatamente assim, cada browser te a sua própria inteligencia e vai tentar operar a situação conforme ele achar melhor.

    Leia mais em: https://en.wikipedia.org/wiki/HTTP_persistent_connection

Conclusão

Não tem como afirmar o qual vai ser mais rápido, no entanto eu recomendo você usar imagens estáticas com Cache e com o 304 Not Modified, veja esta pergunta minha:

Pois desta maneira você terá menos impacto no servidor quanto aos arquivos estáticos, já que as imagens virão do cache nas próximas requisições e ainda por cima irá fazer a página fazer o download mais rápido, isto não influencia diretamente no processo renderização, mas acredito que imagens estáticas sejam mais "fáceis" de renderizar para os browsers que as codificadas.

adicionou 74 caracteres ao conteúdo
Fonte Link
Syzoth
  • 100,5mil
  • 23
  • 169
  • 361
Carregando
Fonte Link
Syzoth
  • 100,5mil
  • 23
  • 169
  • 361
Carregando