2009-03-27 24 views
12

Tenemos algunos datos (10-50 columnas, cientos de miles de filas) que generalmente visualizamos en Excel como un gráfico de líneas o un gráfico de barras apiladas.
Los usuarios quieren poder acercar y alejar el gráfico para llegar a las muestras individuales, pero este tipo de operaciones realmente ponen a Excel de rodillas.¿Está JavaScript listo para visualizar grandes conjuntos de datos?

Estoy pensando en incrustar los datos en una página HTML, con JavaScript en línea para manejar la visualización en el navegador. Algo como el flotr JS charting lib se aprovecharía para los gráficos.

  1. ¿Es esta una idea estúpida?
  2. ¿Está listo el navegador para este tipo de carga?
  3. ¿Es esto un problema resuelto que debería haber buscado en Google más a fondo antes de preguntar?
+0

API Canvas, WebGL y HTML5 - ¡sí! ¡Los navegadores están listos para eso ahora! –

Respuesta

9

JavaScript es probable que esté listo para ello, ya que Javascript a sí mismo ha llegado a ser bastante rápido. En mi experiencia, los navegadores generalmente son y no listos para manejar estructuras DOM muy grandes. Por lo menos, puede esperar pasar mucho tiempo tratando de descubrir por qué las cosas son lentas. También descubrirá que muchas bibliotecas javascript "estándar" (el prototipo/jquery vienen a la mente) no son adecuadas para trabajar con estructuras DOM "excesivamente grandes".

Prepárese para descubrir que una operación dada es lenta en todos los navegadores, pero al final resulta ser por 3-4 motivos diferentes en los diferentes navegadores. Esto se basa en la experiencia de trabajar con DOM moderadamente sobredimensionados. Aunque ciertamente es posible, va a costar una buena cantidad de trabajo para obtener un resultado decente.

+0

Canvas, WebGL y API HTML5 - ¡sí! ¡Los navegadores están listos para eso ahora! –

4

¿Está Javascript listo para visualizar grandes conjuntos de datos?

Sí, el lenguaje es un punto donde sin esfuerzo, en el entorno adecuado, maneja conjuntos de registros significativos y los manipula, visualiza, etc. El lenguaje en sí está bien.

¿Es esta una idea estúpida?

No, de hecho, puede contar con casi todas las computadoras para poder ejecutar este lenguaje multiplataforma capaz.

¿Está listo el navegador para este tipo de carga?

Algunos pueden ser: depende del procesamiento y de las acciones que realmente esté tomando. Con Chrome usando un rápido motor de javascript, y cada vez más gente confiando en él, la guerra de velocidad de JavaScript se enciende. Creo que este es un escenario de uso perfectamente válido.

Tendrá que estar preparado para el benchmarking y la optimización, lo que significa ahondar en las agallas de javascript. Por favor publique sus resultados para que las deficiencias puedan repararse.

-Adam

6

Recomiendo encarecidamente la sugerencia de Adam de realizar algunas evaluaciones comparativas y optimización. Recientemente realicé un trabajo sobre cómo trazar grandes conjuntos de datos con Flot y experimenté un rendimiento inferior al aceptable con Internet Explorer (por ejemplo, el navegador completo cuelga durante ~ 20s en mi cuadro de desarrollador mientras trazo los gráficos).

Flot usa el elemento canvas para la creación de gráficos que solo es compatible con Internet Explorer 9+. Flot proporciona soporte para versiones anteriores de Internet Explorer utilizando la biblioteca ExplorerCanvas. Esta biblioteca usa VML, dibujando gráficos manipulando elementos VML a través del DOM.

Usando el Internet Explorer 8 script profiler descubrí que la mayor parte del tiempo que se tarda en renderizar la trama la pasé llamando al insertAdjacentHTML method nativo para crear los elementos VML. Como no se podía hacer nada para mejorar el rendimiento de las llamadas a métodos nativos, en su lugar trabajé en reducir el número de puntos de datos trazados (a su vez reduciendo los elementos VML creados en el DOM) para obtener un rendimiento aceptable.

Si no necesita o no le preocupa el soporte para versiones anteriores de Internet Explorer, cuando encuentre Flot/Flotr es bastante capaz de manejar grandes conjuntos de datos. Pero si necesita admitir estas versiones, prepárese para tener problemas de rendimiento al crear grandes conjuntos de datos.

+0

+1 -> Algunos enlaces muy útiles allí; Gracias Simon! –

+0

Descubrí que mi navegador se caería si intento hacer que Flot renderice un gráfico de líneas simple con 10k puntos, por lo que es muy recomendable utilizar su zoom + funcionalidad AJAX. – pr1001

Cuestiones relacionadas