Para dados tabulares, o que torna mais rápido, CSS ou ? [fechadas]

StackOverflow https://stackoverflow.com/questions/135826

Pergunta

Eu estou procurando algumas estatísticas sobre os navegadores atuais para o tempo que leva para processar uma tabela usando HTML simples versus um método puritana CSS hackeado-up que evita usar TABLE real, TR, TD etc. tags.

não estou procurando o que é correto, apenas para o que é mais rápido , particularmente no Firefox 3, embora eu também estou interessado nas estatísticas para outros navegadores. De curso marcas tabela são projetados para as tabelas. Essa não é a questão.

Foi útil?

Solução

Em geral, eu diria que o uso

para dados tabular. No entanto, se a tabela é muito longo (digamos, mais de 100 linhas) e o número de colunas é baixa (~ 3), usando divs para linhas Emulate resultaria em uma pegada de marcação muito menor. Isto é especialmente relevante se você estiver usando DOM busca javascript (como previsto pelas bibliotecas muitos JS), uma vez que beneficiaria a reduzir o tamanho da árvore DOM.

Esta é a partir da experiência, eu tinha um tal mesa e estava à procura de otimizações -. Que se deslocam para uma exibição com base div cortar o HTML gerado para um terceiro e foi uma grande melhoria no desempenho travessia DOM

Outras dicas

Se você realmente tem dados tabulares, em seguida, usar tabelas. A idéia de que você nunca deve usar tabelas para qualquer coisa era uma extensão equivocada do conceito correto que você deve usar tags HTML apenas para o seu propósito semântico pretendido. Isso significa usar CSS para layout, mas as mesas de uso para dados tabulares. Isso não significa que nunca use tabelas.

Uma vez que alguns navegadores esperar até que a tabela inteira foi transferida para exibi-lo, a fim de se certificar de que eles têm ajustado as larguras de coluna para o tamanho do conteúdo, usando divs provavelmente render mais rápido se você está procurando para uma média através de cada navegador.

Dito isto, se você precisar de uma tabela, use uma tabela.

Esta questão parece ser semelhante a esta: Por que não usar tabelas para layout em HTML? para que você pode querer verificar algumas das respostas lá também .

Em geral, os navegadores não vai prestar uma mesa até que toda a tabela foi calculada, o que significa que a partir de uma perspectiva do usuário uma grande mesa é mais lento do que o mesmo conteúdo utilizando CSS styling no lugar de tabelas. Eu estava trabalhando com uma aplicação web em um ponto que estava usando tabelas para exibir uma grade de informações de estado, e foi extremamente intensivo para exibir e muito lento. A mesma informação apresentada utilizando CSS foi mais rápido e mais importante, começaram a linha de exibição de linha como ele foi carregado, em vez de esperar para toda a tabela, por isso sentiu mais rápido que um usuário final. Eu sugeriria investigar usando CSS para exibir os dados usando um conjunto de dados de amostra para o teste. Isto é o que eu fiz para confirmar que as mesas eram de fato muito mais lento para o caso de uso específico que tínhamos.

Se você usar CSS para layout e você aderir às melhores práticas e manter seu CSS em um arquivo separado (s), então o seu CSS normalmente só precisam ser baixado uma vez antes de ser armazenado em cache, dando-lhe os benefícios do cache.

Se você usar tabelas para layout, em seguida, suas tabelas de layout será enviado com o HTML para cada página, aumentando a sua largura de banda e tempo de download.

Para melhorar a velocidade de renderização de tabelas que você poderia tentar definir o table-layout: fixed; para ver se isso ajuda ..

Diferentes navegadores têm desempenho totalmente diferente javascript / css, por isso é muito difícil generalizar aqui. Por exemplo, IE7 tem um motor chocantemente lento, e Chrome é assustadoramente rápido. Firefox está em algum lugar no meio, depennding sobre se você estiver usando 2 ou 3.

Eu não levaria a velocidade de renderização como o aspecto mais importante aqui. tabelas HTML são feitos para dados tabulares. Colocar isso em um monte de DIVs ou assim seria totalmente errado na minha compreensão.

Como a maioria das respostas acima, eu também diria Tabelas de uso se você estiver exibindo dados tabulares e DIVs se você quiser layout de controle (usando CSS3). Ao contrário da crença, tabelas não mais lento são na prestação de DIVs se você definir algumas propriedades como colgroup e manter layout como fixo. Confira os detalhes de como no seguinte link:

sites.google.com/site/spyderhoodcommunity/xhtml/makingtablesrenderfasterwhenlistingtabulardata

Para os dados tabulares, use uma tabela. Mesas vêm com todos os tipos de características interessantes, como <thead> e <tfoot> etiquetas, legendas, títulos, legendas, etc. Tudo que você precisa para fazer uma tabela de uma tabela.

Além disso, se a CSS não trabalho / não está carregado / não importa, a tabela vai ainda olhar e trabalhar da maneira que deveria.

Pessoalmente do que eu li, se você está realmente apresentação de dados tabulares, uma mesa é mais apropriado para a tarefa, eu pessoalmente hae descobriu que isso é muito verdadeiro.

Como para número bruto do que é "mais rápido", como mencionado por @skaffman depende dos navegadores ... mas para ser "correta" não faria sentido usar uma tabela para dados tabulares.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top