2012-03-18 33 views
18

¿Cuáles son las ventajas y desventajas de usar menos lado del servidor frente al lado del cliente en un entorno de producción en vivo? ¿Por qué querría convertir mi css menos estático y utilizarlo en vez de estar en vivo? Según tengo entendido, el css está en caché tanto del lado del servidor como del lado del cliente, por lo que la velocidad no debería ser un problema y no está disponible, ya que mi aplicación es muy dependiente de javascript, por lo que si no estuviera disponible tendría problemas mayores. No entiendo completamente cómo funciona la compilación del lado del servidor ... graciasUtilice menos (preprocesador css) del lado del servidor o del lado del cliente

Respuesta

25

Trabajé en un proyecto grande que usaba LESS. El problema principal que encontramos al compilarlo desde el lado del cliente (en entornos de desarrollo) es que la compilación del lado del cliente requiere JavaScript y la impresión convierte la página en papel sin JavaScript habilitado, por lo que cada vez que alguien imprimía una página, salía completamente sin estilo. Incluso si su aplicación utiliza grandes cantidades de JavaScript como el nuestro, si desea admitir la impresión, debe compilar el servidor o proporcionar CSS estático.

La solución que funcionó mejor para nosotros fue ejecutar node.js para compilar LESS del lado del servidor sobre la marcha en entornos de desarrollo, y luego precompilarlo en un solo archivo cz gzip al implementar el sitio en producción.

La precompilación también reduce el número de solicitudes individuales de archivo realizadas por el cliente de docenas por página en nuestro caso (una por cada archivo LESS) a solo un archivo CSS y hace que la carga sea más rápida al evitar el paso de compilación (que less.js del lado del cliente tiene que ejecutarse cada vez que se navega una página nueva antes de que la página pueda comenzar a renderizarse.)

No recomendaría compilarlo en el servidor en un entorno de producción real, porque eso agregará mucha carga de procesador innecesaria. Si lo compila con anticipación, no consumirá más recursos del servidor que un único archivo CSS común.

+0

gracias, solo para confirmar que he entendido ... esto significa en el lado del cliente, cada vez que se carga una página, menos se procesa. en el lado del servidor, menos se procesa solo para la primera página que se carga y luego se almacena en caché y no se procesa de nuevo? –

+0

Sí, en el lado del cliente debe compilarse cada vez que se visualiza una página. Si tiene una buena implementación en el lado del servidor, almacenará en caché el CSS compilado y lo publicará hasta que cambien sus archivos fuente LESS. Pero a menos que planee cambiar las hojas de estilo sobre la marcha, puede compilar su LESS por adelantado con la misma facilidad con que lo despliega en producción, guardándolo como un archivo CSS plano al que se hace referencia directamente desde su HTML. Eso evitará que node.js siquiera tenga que ejecutarse y es, de lejos, la forma más eficiente de servir LESS. –

+1

También: es mejor compilar CSS una vez como parte de una secuencia de comandos de implementación que contar con la compilación que funciona automáticamente por el servidor. – mlissner

3

El navegador solo puede almacenar en caché los datos que recibe del servidor. Esto no incluye incluyen el CSS compilado en el navegador desde menos (mecanismos de almacenamiento local HTML5 a un lado). Esto significa que el navegador debería compilar menos archivos en CSS cada vez que se carguen, incluso si el menor archivo se carga desde el caché del navegador en lugar de desde el servidor.

Cuestiones relacionadas