Una aplicación web, se distribuye descargando archivos directamente al navegador o al cliente.
Un conjunto de archivos usualmente es llamado "bundle"
La forma Old-school
Escribir todo el CSS inline o en un solo archivo
Escribir el JS inline o en un solo archivo
Un HTML por página
Tomar todos los archivos y subirlos a través de FTP al servidor
Consideraciones importantes
El tamaño de los archivos al transmitirse
El tamaño de los archivos al ejecutarse
Partes críticas de la aplicación
Disponibilidad inmediata del contenido
SEO / Performance
¿Ingeniería inversa?
Debido a la naturaleza de la web sería muy sencillo inferir cómo está construida una aplicación y clonarla para uso malicioso, dando paso al "Phishing"
Construyendo bundles
Uglificación: Cambiar el nombre de variables y funciones de tal forma que sean ilegibles para el ojo humano
Minificación: Reducir el tamaño de los archivos, removiendo caracteres necesarios únicamente para el ojo humano
Construyendo bundles
Compresión: Eliminar la cantidad de bytes usados por un archivo, reutilizando bytes comunes a través de un algoritmo
Unificación: Reducir la cantidad de archivos que hacen funcionar una aplicación web
Pre-procesamiento
Basándonos en el principio DRY y las buenas prácticas de programación, es más sencillo separar una aplicación en archivos individuales e independientes que permitan el mantenimiento a largo plazo
Pre-procesamiento CSS
Supersets de CSS cuya finalidad es agregar características que simplifican la escritura/reutilización de las hojas de estilos
SASS/SCSS
LESS
Stylus
Postcss
Pre-procesamiento JS
Supersets de JS/Lenguajes de scripting cuya finalidad es agregar características que simplifican la escritura/reutilización del código Javascript y que se compilan/transpilan a javascript
