Ayer Brian Moschel me envió un mail informándome de la publicación de Include, un componente de JavascriptMVC, que nos permite cargar y comprimir nuestro javascript de una forma muy sencilla, sin importar la complejidad de dependencias que por debajo haya.
Imaginemos que tenemos un entorno de trabajo del que necesitamos cargar una gran cantidad de funcionalidad javascript, toda ella desperdigada en diferentes ficheros javascript. Con Include
podemos cargar esa funcionalidad a medida que la vamos necesitando, de forma comprimida, usando el script de Dean Edwards, para reducir el tiempo de carga por parte de nuestro navegador
Instalación
Al estar desarrollado sobre Javascript, basta con incluir la llamada al fichero en el <head>
de nuestro HTML. Los ficheros Compres.js
y Compres.html
deben estar en la misma ruta que el include.js
.
<script src="include.js" type="text/javascript"></script>
Modo de uso
Incluir otros ficheros javascript es algo tan sencillo como esto:
<script type="text/javascript">
include('javascripts/prototype', 'javascripts/myapplication');
</script>
Lo que nos permite cargar el javascript en cualquier lugar simplemente llamando a la función con los parámetros necesarios. Los ficheros serán cargados a medida que se solicitan, por lo que el orden de carga lo definimos nosotros.
Comprimir el javascript
Para que Include
se ponga en modo compress
, simplemente tenemos que especificarlo antes de solicitar los ficheros, a modo de configuración previa.
<script type="text/javascript">
include.setup({env: 'compress'});
include('javascripts/prototype', 'javascripts/myapplication');
</script>
Ejecutar en producción
Tambien dispone de un modo «production
» ideal para trabajar en la versión final de nuestras aplicaciones. Podremos especificar una ruta diferente de en donde se encuentran los ficheros javascript mediante un parámetro más.
<script type="text/javascript">
include.setup({env: 'production', production: 'path/to/prod'});
include('javascripts/prototype', 'javascripts/myapplication');
</script>
API
Tambien disponemos de una serie de funciones con las que podremos complementar nuestros scripts.
include.get_absolute_path() // Nos devuelve la ruta absoluta.
include.get_env() // Nos informa del entorno que hemos definido ("development", "compress" o "production")
include.get_path() // Directorio de trabajo
include.include() // Función principal que carga N ficheros javascrips solicitados por parámetro.
- path: Ruta del fichero (String)
- base62: Activar la compresión para el fichero concreto (true/false)
- shrink_variables: Shrink variables de dicho fichero (true/false)
include.opera() // Debe ir detrás de los includes si estás usando Opera
include.setup() // Configuración del script
- env: Entorno de desarrollo ("development", "compress" o "production")
- production: Ruta de los ficheros javascript (String)
- base62: Activa la compresión (true/false)
- shrink_variables: Shrink variables de dicho fichero (true/false)
- remote: Activa el sistema de compresión remota desde otra aplicación (true/false)
include.plugin() // Nos permite cargar un plugin de JavascriptMVC
include.plugins() // Nos permite cargar plugins de JavascriptMVC
include.set_path() // Definimos la ruta de los ficheros
7 comentarios, 3 referencias
+
#