Per i dati tabulari, ciò che rende più veloce, CSS o & TAVOLO > ;? [chiuso]

Question

Sto cercando alcune statistiche sui browser attuali per quanto tempo ci vuole per eseguire il rendering di una tabella usando HTML semplice rispetto a un metodo puritan CSS compromesso che evita di utilizzare TABLE , TR , TD ecc.

Non sto cercando ciò che è corretto, solo per ciò che è più veloce , in particolare su Firefox 3, anche se sono interessato anche alle statistiche per altri browser. Naturalmente i tag naturalmente TABELLA sono progettati per le tabelle. Non è questa la domanda.

Answer 1

In generale, direi di usare < table > per dati tabulari. Tuttavia, se la tabella è molto lunga (diciamo, oltre 100 righe) e il numero di colonne è basso (~ 3), l'uso di div per emulare le righe comporterebbe un footprint di markup molto più piccolo. Ciò è particolarmente pertinente se si utilizza javascript di ricerca DOM (come fornito dalle numerose librerie JS), poiché trarrebbe vantaggio ridurre le dimensioni dell'albero DOM.

Questo è per esperienza, avevo una tabella del genere e stavo cercando ottimizzazioni: passare a un display basato su div ha ridotto il codice HTML generato a un terzo ed è stato un grande miglioramento delle prestazioni di attraversamento del DOM.

Answer 2

Se disponi davvero di dati tabulari, usa le tabelle. L'idea che non dovresti mai usare le tabelle per nulla era un'estensione errata del concetto corretto secondo cui dovresti usare i tag html solo per il loro scopo semantico previsto. Ciò significa che utilizzare CSS per il layout, ma utilizzare le tabelle per i dati tabulari. Ciò non significa che non usare mai le tabelle.

Answer 3

Dato che alcuni browser attendono che l'intera tabella sia stata trasferita per visualizzarla al fine di assicurarsi di aver regolato la larghezza delle colonne in base alle dimensioni del contenuto, l'utilizzo di div probabilmente render sarà più veloce se stai cercando per una media su tutti i browser.

Detto questo, se hai bisogno di una tabella, usa una tabella.

Answer 4

Questa domanda sembra essere simile a questa: Perché non utilizzare le tabelle per il layout in HTML? quindi potresti voler controllare anche alcune delle risposte lì .

In generale, i browser non renderizzeranno una tabella fino a quando l'intera tabella non sarà stata calcolata, il che significa che dal punto di vista dell'utente una tabella di grandi dimensioni è più lenta dello stesso contenuto usando lo stile CSS al posto delle tabelle. Stavo lavorando con un'applicazione web a un certo punto che utilizzava tabelle per visualizzare una griglia di informazioni sullo stato ed era estremamente intenso da visualizzare e molto lento. Le stesse informazioni visualizzate usando CSS erano più veloci e, cosa più importante, iniziarono a essere visualizzate riga per riga mentre venivano caricate, invece di attendere l'intero tavolo, quindi sembrava più veloce come utente finale. Suggerirei di indagare usando i CSS per visualizzare i dati usando un set di dati di esempio per i test. Questo è quello che ho fatto per confermare che le tabelle erano in effetti molto più lente per il particolare caso d'uso che abbiamo avuto.

Answer 5

Se si utilizza il CSS per il layout e si aderisce alle migliori pratiche e si mantiene il CSS in un file separato (s), in genere il CSS deve essere scaricato solo una volta prima di essere memorizzato nella cache, offrendo i vantaggi della memorizzazione nella cache.

Se si utilizzano le tabelle per il layout, le tabelle del layout verranno inviate con l'HTML per ogni pagina, aumentando la larghezza di banda e i tempi di download.

Per migliorare la velocità di rendering delle tabelle, è possibile provare impostazione del layout della tabella: fixed; per vedere se questo aiuta ..

Answer 6

Browser diversi hanno prestazioni javascript / css molto diverse, quindi è molto difficile generalizzare qui. Ad esempio, IE7 ha un motore incredibilmente lento e quello di Chrome è incredibilmente veloce. Firefox è a metà strada, dipende da se stai usando 2 o 3.

Answer 7

Non prenderei la velocità di rendering come aspetto più importante qui. Le tabelle HTML sono create per dati tabulari. Metterlo in molti DIV o giù di lì sarebbe totalmente sbagliato nella mia comprensione.

Answer 8

Come la maggior parte delle risposte di cui sopra, anche io direi Tabelle se stai visualizzando dati tabulari e DIV se vuoi controllare il layout (usando CSS3). Contrariamente a quanto crediamo, le tabelle non sono più lente nel rendering rispetto ai DIV se imposti alcune proprietà come colgroup e mantieni il layout fisso. Scopri i dettagli su come nel seguente link:

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

Answer 9

Per i dati tabulari, utilizzare una tabella. Le tabelle sono dotate di tutti i tipi di funzioni interessanti, come < thead > e < tfoot > tag, legende, titoli, didascalie, ecc. Tutto ciò che serve per creare un tavolo un tavolo.

Inoltre, se il CSS non funziona / non è caricato / non importa, la tabella apparirà e funzionerà come dovrebbe.

Answer 10

Personalmente da quello che ho letto, se in realtà stai presentando dati tabulari, una tabella è più appropriata per l'attività, personalmente ho scoperto che è abbastanza vero.

Per quanto riguarda il numero grezzo di ciò che è "più veloce", come indicato da @skaffman, dipende dai browser ... ma per essere "corretto" avrebbe senso usare una tabella per i dati tabulari.