Lezione 14Per andare oltre, alcune pratiche di codifica
- Nozione 86 - Introduzione alle pratiche di codifica del web eco-design con il progetto di The Good Manager
- Nozione 87 - Pulire il codice per l'efficienza energetica
- Nozione 88 - Codice asincrono: fai di più, in poco tempo
- Nozione 89 - Server più efficienti e meno dispendiosi a livello energetico
- Nozione 90 - Gestisci il carico di lavoro del tuo server
- Nozione 91 - Usare delle librerie esterne: l'esempio del CDN Bootstrap
- Nozione 92 - Revisione delle pratiche di codifica
Nozione 91
Usare delle librerie esterne: l'esempio del CDN Bootstrap
competenza target
Esercizio
Bootstrap è una famosa libreria per progettare le pagine e aggiungere le funzionalità interattive.
Lo puoi anche usare con i file locali o con un CDN.
In questo esercizio puoi imparare di più sul Bootstrap e provare a valutare il suo impatto ecologico quando viene importato su una pagina web.
Risorse
#Codice Bootstrap
Puoi saperne di più sul Bootstrap sul sito ufficiale: https://getbootstrap.com/docs/5.1/getting-started/introduction/
Il codice Bootstrap è disponibile a questi indirizzi:
- CSS code, per il layout: https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css
- JS code, fper le interazioni: https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.min.js
#Usa il codice Bootstrap sul tuo sito
Dai un'occhiata ai diversi CDN usati per importare gli elementi richiesti da Bootstrap per funzionare: https://www.bootstrapcdn.com/
Per usare il codice di Bootstrap sul tuo sito, hai bisgno di inserire questi indirizzi nei marcatori HTML appositi:
<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>
From these resources, you can evaluate the weight of these files, by going to one of these addresses and doing "save as".
Correzione
Per utilizzare Bootstrap, è necessario importare 2 file da CDN:
- Un file di stile (CSS), che pesa 160kb
- Un file di script (Javascript), che pesa 76kb
Può sembrare poco, ma non tutte le funzionalità di Bootstrap vengono generalmente utilizzate in una singola pagina web, il che significa che alcuni elementi vengono trasferiti per nulla.
Questo esercizio mette in prospettiva il peso del codice inutile che può essere importato da librerie esterne e come valutarlo.