¿Es mejor tener CSS minimizado que tener un CSS bonito y bien formado en un entorno de producción?

Creo que desplegar un archivo CSS minimizado en producción es la mejor manera de hacerlo. Siempre que tenga una versión “canónica” de su código original, ya sea MENOS o Sass, entonces tener un tamaño de archivo más pequeño tiene más sentido.

Piénselo de esta manera: al navegador no le importan los espacios en blanco, la sangría ni el código lógicamente comentado. Simplemente mastica la totalidad de un archivo CSS de principio a fin, omitiendo todas las partes insignificantes que lo hacen legible para los humanos.

Además, creo que en lugar de utilizar @import en un archivo CSS, creando solicitudes HTTP adicionales para ir a buscar esos archivos adicionales, tiene más sentido concatenar múltiples archivos (también conocidos como “parciales”) en un archivo CSS maestro, suponiendo que todos se utilizarán fragmentos en el sitio (de lo contrario, también tendrá archivos CSS separados, hechos de combinaciones variables de parciales).

Realmente, el deseo de mantener un archivo CSS legible por humanos proviene del hábito, porque antes de los preprocesadores, tendíamos a tener un archivo * .css canónico y (a veces) desplegábamos un archivo * .css minificado por separado basado en eso.

Pero ahora con MENOS (o Sass), simplemente mantendría el CSS sin minimizar en caso de que alguien quiera ver la fuente. Pero nunca va a editar ese archivo de todos modos, ya que la próxima compilación lo sobrescribirá.

(Sugerencia: si desea compartir el código no minimizado, simplemente tírelo en un sitio de intercambio de código como GitHub y ponga una nota como comentario HTML, señalando a los usuarios curiosos de la fuente de visualización a la URL de la versión no minificada).

Para usar una analogía cursi de Star Wars, pienso de esta manera: su archivo original * .less o * .sass es su Jango Fett. El CSS resultante que proviene de eso es solo parte de un “ejército de clones”, fácilmente prescindible siempre que su archivo fuente se mantenga intacto.

Sí. Punto final.

Dos puntos de seguimiento:

1) MENOS Y SASS (et al) son intimidantes.
CSS es un lenguaje de nivel de entrada para la mayoría de las personas. Cosas como Ruby (Sass) y la línea de comando, etc. tienden a ahuyentar a las personas del código. Me gusta el hecho de que HTML y CSS son muy accesibles y sirven como “lenguajes de entrada” para muchas personas en el mundo web. La minimización de su código (ya sea a través de LESS, SASS u otros métodos) es buena y es una buena práctica, pero no debe considerarse un requisito para escribir CSS efectivo.

2) Solo en las etapas finales de producción (depende de la tubería de producción)
Para mí, cuando estoy en desarrollo, necesito poder identificar los números de línea CSS en mi navegador y encontrar esos números de línea en mis archivos. Cuando se usa la minificación al principio del proceso, esto puede perderse. Uso solo en producción.

Por lo general, la mejor práctica es minimizar siempre su CSS, a menos que sea importante mostrar a otros desarrolladores cuán “genial” es su CSS. El término “mejor práctica” generalmente significa que solo el 10% de los desarrolladores usarán esa práctica, debido al paso adicional que debe realizar. Con el lado del servidor MENOS y Sass no tienes ese paso adicional porque se encargarán de la minificación.

El rendimiento de CSS es muy, muy importante, casi todos los navegadores mostrarán el diseño después de procesar el CSS, por lo que un CSS más pequeño es esencial para el rendimiento del sitio.