NorfiPC
NorfiPC » Códigos » Librerías JavaScript

Librerías JavaScript, usos, diferencias y donde cargarlas



Descripción de las librerías más populares en internet, características, precauciones al usarlas en las páginas y los CDN más rápidos desde donde enlazarlas.
Librerías JavaScript, usos, diferencias y donde cargarlas
Las librerías JavaScript son archivos con instrucciones para agregarle diversas funcionalidades y efectos a las páginas de internet, usando este lenguaje de programación.
Todos los navegadores modernos incluyen de forma nativa JavaScript, lo que les permite interpretar funciones básicas, estas librerías agregan otros recursos para manipular la estructura de las paginas (DOM) de forma dinámica y el estilo visual (CSS), como demanda la web moderna.
Estos archivos son proporcionados por diferentes servicios en la red y se pueden descargar libremente o enlazarlos a las páginas.
En varios artículos de este sitio hacemos referencias a algunas de estas librerías y explicamos cómo usarlas.
En este artículo compartimos cuales son las más empleadas y populares y los servicios CDN desde donde cargarlas.



Las librerías JavaScript más populares en internet


Para crear este artículo nos basamos en las estadísticas del servicio de W3Techs
Según sus datos, el 75% de todos los sitios de internet usan librerías de JavaScript.
De ellas las más populares son las siguientes:

JQuery

JQuery es la más popular de las librerías JavaScript de internet.
Es un archivo que contiene varias instrucciones, que permiten que el navegador ejecute muchas funcionalidades adicionales.
JQuery es muy empleada para hacer cambios de forma dinámica en el DOM (estructuras de las páginas), sin tener que recargarlas y agregarles gran cantidad de efectos y animaciones.
Podemos cambiar el tamaño, la forma o el estilo de cualquier elemento de una página.
Sobre JQuery se han desarrollado otras extensiones, como JQuery UI.
En otros artículos de nuestro sitio se puede conocer cómo usar JQuery y JQuery UI, incluyendo en cada uno varios ejemplos prácticos.
✔ Sitio web: http://jquery.com/



Bootstrap

Bootstrap es un framework web (marco de trabajo) libre y de código abierto, muy popular usado para crear sitios web.
Ofrece plantillas HTML, hojas de estilo CSS, fuentes y una librería para adicionar funcionalidades adicionales a las páginas, por ejemplo botones, menús, barras de navegación, paneles, visores de imágenes, etc.
Se apoya en JQuery, por lo que es necesario cargar esta librería previamente.
Bootstrap es uno de los proyectos más populares en Github.
✔ Sitio web: http://getbootstrap.com/
✔ Proyecto en Github: https://github.com/twbs/bootstrap
✔ Carga desde este sitio una página creada con Bootstrap.

Modernizr

Modernizr es una librería que detecta funcionalidades HTML5 y CSS3 en los navegadores web.
Es empleada en muchas aplicaciones web como una herramienta imprescindible para poder funcionar adecuadamente.
Es solo un método de detección y no agrega ninguna funcionalidad adicional.
Modernizr está disponible como un proyecto libre en Github.



MooTools

Es un JavaScript framework (marco de trabajo) modular, orientado a objetos.
Proyecto inspirado en Prototype, permite agregar efectos simples y básicos a las páginas, usando una librería de pequeño tamaño, que se puede personalizar completamente.
Sitio web: http://mootools.net/

ASP.NET Ajax

Librería JavaScript basada en ASP.NET, desarrollada por Microsoft. La usan todos los sitios de esta empresa y varios sitios de internet.

Prototype

Es un JavaScript framework, enfocado principalmente en creación de contenido dinámico y actualizaciones asíncronas en páginas y aplicaciones web.
Su librería es usada por varios proyectos.
Sitio web: http://prototypejs.org/

Script.aculo.us

Librería JavaScript basada en Prototype, al que agrega efectos visuales, controles y utilidades. Su desarrollo no está actualizado.

AngularJS

Librería JavaScript de código abierto mantenida por Google y varios desarrolladores independientes, para crear aplicaciones web de una sola página.
AngularJS es uno de los proyectos más populares en Github.

Otras librerías

YUI Library, Underscore, Shadowbox, Spry, GSAP, Backbone, Knockout, Dojo, Ext JS, Vue.js, Semantic UI, Zepto, React, Sizzle, DHTMLX, MochiKit, Ember.js y p5.js.



Precauciones al usar las librerías y scripts en las páginas


Las librerías JavaScript al igual que los scripts que proporcionan las redes sociales y otros servicios de internet, pueden ser en algunos casos letales.
Antes de decidirnos a insertar cualquier script externo en las páginas de un sitio web, debemos de conocer que siempre existe el riesgo que paralice por completo o bloquee la carga de la página donde se encuentra.
Si dicho script no está disponible o existe retraso en su entrega, por algún motivo como lentitud en la red o no disponibilidad del servidor donde se aloja, nuestra página puede bloquearse completamente.
Para evitarlo tenemos las siguientes alternativas:
1- Enlazar los scripts o librerías desde un servicio rápido y estable que emplee un CDN.
Un servicio CDN (Content Delivery Network), es un servicio que posee varios servidores o centros de datos repartidos geográficamente.
Más abajo se pueden conocer cuáles son los más rápidos y eficientes.

2- Cargar el script se forma asíncrona.
El modo asíncrono, opción que admiten todos los navegadores modernos, permite que el archivo o librería sea descargado de forma paralela a otros recursos, por lo que si no está disponible o existen retrasos, no afectará la carga de la página.
Para eso es necesario agregar la propiedad "async" a la etiqueta de los scripts de la siguiente forma:
<script async src="direccion-url-script.js"></script>
Lamentablemente muchas librerías no admiten esta opción.

3- Alojar el script en nuestro servidor en los casos en que lo permita.
Esta puede ser la mejor opción, desde que permite un mayor rendimiento.
No está disponible para muchos casos en los que se usan servicios de alojamiento gratis.
Los scripts que proporcionan algunas redes sociales como Facebook y Google Plus, así como los de Google Analytics y otros servicios, de forma predeterminada usan el modo asíncrono.



Los principales CDN que alojan las librerías JavaScript


Usando el mismo servicio de W3techs, conocemos que el 76% de los sitios de internet o no usan librerías JavaScript o las alojan ellos mismos.
El resto de los sitios cargan las librerías desde los siguientes CDN de internet.
Están ordenados por su popularidad.

Google Hosted Libraries

Servicio de alojamiento de librerías JS que proporciona Google.
Es rápido y estable, con la ventaja de usar los centros de datos del buscador.
Los archivos son cargados usando la siguiente dirección: https://ajax.googleapis.com/
Se aloja en este servicio entre otras: AngularJS, jQuery, jQuery Mobile, jQuery UI, MooTools, Prototype, script.aculo.us, etc.
Se puede obtener el enlace de todas las librerías con sus versiones en: Google Hosted Libraries

CDNJS

Servicio de alojamiento de librerías que proporciona CloudFlare.
Usa el poderoso CDN que posee más de 100 bases de datos distribuidas globalmente, para albergar todo tipo de librerías de código abierto.
Se promociona como el más rápido y es actualmente el de mayor crecimiento.
Para obtener el enlace a cualquier librería, solo necesitamos hacer una búsqueda por su nombre en: https://cdnjs.cloudflare.com/.

jQuery CDN

Servicio proporcionado por el CDN de Maxthon, que aloja las diferentes versiones de la librería JQuery y sus extensiones jQuery Mobile y jQuery UI.
https://code.jquery.com/.

jsDelivr

https://www.jsdelivr.com/.

Yandex Libraries Hosting

Servicio ruso de alojamiento de librerías.

Microsoft Ajax CDN

Servicio de Microsoft que aloja librerías de ASP.NET y de terceros como JQuery, Modernizr, JSHint, Knockout, Globalize, Respond, Bootstrap y Hammer.
Los archivos son cargados usando la siguiente dirección: http://ajax.aspnetcdn.com/
Lee más información en: https://www.asp.net/ajax/cdn.

Esta información puede ayudarnos a decidirnos desde donde enlazar las librerías que vamos a usar en nuestro sitio, aunque para estar más seguros podemos hacer una prueba de velocidad y así comprobar cuál de ellos brinda menores tiempos de carga, de acuerdo a nuestra ubicación geográfica.

Páginas relacionadas



Comparte esta página




Sígueme en las redes sociales


Sígueme en Google Plus Sígueme en Facebook Sígueme en Twitter Sígueme en Pinterest





 
Inicio | Mapa del sitio | Sobre mí | RSS | Buscar