The Good Manager  >  Módulos formativos

100 puntos a saber sobre...
Desarrollo de una web de diseño eco

100
puntos a saber sobre...
Desarrollo de una web de diseño eco
Volver al resumen del módulo

Noción 91

Uso de bibliotecas externas: el ejemplo de las CDN de Bootstrap

Competencias objetivo

Analizar el impacto de una biblioteca externa en un sitio web

Ejercicio

Bootstrap es una famosa librería para crear estilos de páginas rápidamente y añadir funciones interactivas.

Puedes usarla con archivos locales o a través de una CDN.

En este ejercicio, aprende más sobre Bootstrap e intenta evaluar su impacto cuando se importa en una página web.

Recursos

Código de Bootstrap

Puedes obtener más información sobre Bootstrap en la documentación oficial: https://getbootstrap.com/docs/5.1/getting-started/introduction/

El código de Bootstrap está disponible en estas direcciones:

Usa el código de Bootstrap en tu propio sitio web

Puedes echar un vistazo a las diferentes CDN usadas para importar los elementos que necesita Bootstrap para funcionar: https://www.bootstrapcdn.com/

Para usar el código de Bootstrap en tu propio sitio, debes encapsular estas direcciones en etiquetas HTML específicas:

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet">

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>

Desde estos recursos, puedes evaluar el peso de estos archivos, yendo a una de estas direcciones y haciendo "guardar como".

Corrección

Para usar Bootstrap, necesitas importar 2 archivos desde CDNs:

  • Un archivo de estilo (CSS), que pesa 160kb
  • Un archivo de script (JavaScript), que pesa 76kb

Puede no parecer mucho, pero no todas las características de Bootstrap se usan generalmente en una sola página web, lo que significa que algunos elementos se están transfiriendo para nada.
Este ejercicio pone en perspectiva el peso del código considerado inútil que se puede importar de librerías externas y cómo evaluarlo.