Este recurso já está disponível para teste aqui no Meta. Fazer upload de uma imagem aqui acionará um redimensionamento/codificação no navegador do usuário antes de ser enviado ao servidor.
Por favor, experimente, neste tópico ou em sua própria comunidade, ativando a configuração do site “composer media optimization image enabled”. Estamos deixando desativado por padrão enquanto fazemos os testes.
Para ilustrar as diferenças, aqui está um antes/depois:
Um ponto menor sobre o medidor de porcentagem de carregamento. Ao fazer o upload desta imagem HEIC de 6,1 MB, notei que ela avançou para 100% relativamente rápido, depois permaneceu lá por cerca de 50 segundos antes de concluir. Isso pode causar confusão ou cancelamentos.
Isso é incrível. Uma pergunta rápida, talvez uma óbvia: seria possível habilitar isso apenas para imagens acima do limite do site? Assim, as imagens até o limite não seriam processadas, mas se alguém tentar ultrapassá-lo, elas seriam aparentemente redimensionadas para caber?
Você não testou esse novo recurso, pois ele não funciona com imagens HEIF ingeridas. Eu queria trabalhar com HEIF, mas o suporte do navegador para decodificação é inexistente HEIF/HEIC image format | Can I use... Support tables for HTML5, CSS3, etc. Portanto, você testou a conversão HEIF no lado do servidor que já funciona há bastante tempo.
Eu poderia fazer funcionar distribuindo um decodificador WebAssembly, mas essas imagens são tão raras que não achei necessário, pois já temos a conversão no lado do servidor em que @pmusaraj trabalhou.
Por enquanto, esse recurso pode ingerir JPG, PNG e GIF. Posso facilmente adicionar suporte para AVIF/JPEGXL/TIFF e farei isso em breve.
Sim! Ajuste composer media optimization image kilobytes optimization threshold para o valor desejado.
Não, ele não fará isso. Esse trabalho ocorre no navegador do usuário, na hora, antes do upload. Rebake é um processo no lado do servidor, então são bastante diferentes.
(Uma foto de 28 MB que tirei do centro da minha cidade durante o primeiro confinamento em 2020)
Testei o upload com várias velocidades de conexão, de 1 Gbps a 1 Mbps. Funcionou bem, exceto para a largura de banda de 1 Mbps. O comportamento do upload nesta última foi um pouco estranho.
Ficou travado em 0% por muito tempo, depois uma porcentagem aumentando rapidamente (mais rápido do que uma conexão de 1 Mbps faria), depois travou em 100% por muito tempo antes de mostrar esta mensagem:
Se cancelarmos a mensagem e descartarmos o rascunho enquanto estávamos carregando uma imagem e, em seguida, quisermos postar uma nova resposta, a barra de carregamento continua sendo exibida no editor:
Precisamos recarregar a página para que isso desapareça.
É meio confuso para o usuário que o site permita enviar e exibir uma imagem de 50 MB, mas quando tento enviar uma imagem de 21600×21600 com 108 MB (de aqui), recebo esta mensagem:
A confusão aqui é que imagens > 4 MB são proibidas, mas imagens de 50+ MB são permitidas de qualquer forma.
Qual é o motivo real pelo qual não consigo fazer o upload desta imagem?
Foto muito legal! De 28 MB para 113 KB é uma relação bastante boa!
Então, esse novo recurso altera apenas a fase de “pré-upload”. Nós interceptamos o arquivo que você tenta enviar, aplicamos transformações nele e, em seguida, substituímos o novo arquivo menor e retomamos o processo de upload original.
Ele permanece em 0% e exibe “Processando…” na fase de pré-upload, então isso é esperado. Vou tentar também substituir a string “Enviando…” na parte inferior.
4 MB ainda é proibido; o truque é que otimizamos a imagem para que ela seja > 4 MB quando possível, para que possa sobreviver à limitação de tamanho do arquivo.
Testei algumas imagens desse site, mas todas usam opacidade PNG, então não consigo converter com segurança para JPG e o otimizador desiste.
Testei um PNG de 60 MB agora, e o otimizador consegue lidar com ele, mas usa mais de 4 GB de RAM durante o processo para acabar com um JPG de 360 KB.
Qual dispositivo, navegador e versão do sistema operacional você estava usando nesse teste?
Comecei a usar a otimização de imagens do Composer. Percebi que, se eu quiser fazer upload de mais fotos, o botão de responder é ativado após o primeiro upload de imagem e só é desativado quando a otimização da próxima imagem termina. Se clicar no botão de responder nesse momento, os outros uploads de imagem ficam travados e apenas o texto é composto (processando). Não consigo reproduzir aqui, pois no Meta o botão muda rapidamente, mas no meu site ele fica travado na maioria das vezes, com cerca de 10 segundos ou mais entre os uploads. Estou usando as configurações padrão e 3 imagens de ~3-4 MB.
Testei com um Huawei P20 Pro, Android 10 (Chrome 91.0.4472.120), no Webapp.
Como você pode ver no vídeo, após os uploads (Feltöltés), o botão de responder é ativado. Cada imagem tem ~2,3 MB.
Seria possível desativar o botão de Responder o tempo todo enquanto as imagens estão sendo carregadas?
Estou confuso com essa configuração. “Kilobytes” está correto?
Sim Kilobyte - Wikipedia. O padrão é meio megabyte, mas você pode ajustar conforme necessário. Recomendo definir o valor mais baixo possível, em torno de ~300 KB, se quiser economizar mais espaço.
Entendi. Eu pensei que fosse um erro de digitação de bytes para kilobytes. Porque eu coloquei 524288kb no conversor e ele mostrou 512mb. Foi isso que me confundiu. Mas sim, agora entendi Obrigado
Obrigado pela correção Agora está funcionando perfeitamente!
Tenho uma dúvida sobre uploads pelo celular. Quando faço o upload de uma imagem pelo celular, ela não redimensiona para a largura em pixels desejada. Acredito que apenas a qualidade seja alterada. Se tento fazer isso no computador desktop, o redimensionamento funciona. Será que estou esquecendo algo? Obrigado
Tentamos redimensionar tanto em dispositivos móveis quanto em desktops, mas a operação pode falhar se o hardware do seu dispositivo for muito fraco. Nesse caso, pulamos o redimensionamento.
Obrigado, Falco.
