DEADScript: El Papel de JavaScript en la Sostenibilidad Web

¡Buenos días, DOM! Me conocen, me gusta saludar al DOM cada mañana. Pero también voy a decir buenos días, Ámsterdam, o debería llamarlo GCE Europe West 4. Así es como lo llamamos en el trabajo, es una de nuestras zonas. Pensé que era bastante gracioso.

De todos modos, vayamos al grano. Tiendo a hablar mucho sobre el performance web. Es algo que hago en el trabajo. También son los ingenieros con los que hablo en el trabajo. Y, ya saben, cubrimos cosas como, no sé, Core Web Vitals, como esa nueva métrica que se anunció hace unas tres semanas o algo así. Pero definitivamente hablo de métricas, porque estamos rodeados de métricas en el trabajo. Así que hablaré sobre métricas de pintado. Hablaré sobre métricas de velocidad. También hablaré sobre métricas de tiempo. Pero hoy voy a hablar sobre toneladas métricas. ¿Eh? ¿De qué puede tratarse eso? Bueno, voy a hablar sobre el medio ambiente. Voy a hablar sobre sostenibilidad. Y ¿qué piensas cuando escuchas palabras como medio ambiente y sostenibilidad? ¿Qué se te viene a la mente? Bueno, seré muy sincero y honesto. Mi hermano se compró un Tesla, y estoy un poco celoso porque es muy bonito. Así que he estado pensando en este Ioniq 6, que es bastante icónico, de Hyundai. Me encanta la forma. Pero volvamos al tema que nos ocupa, que es la sostenibilidad. Y específicamente, vamos a hablar de la sostenibilidad digital. Y como esta es la conferencia JS Nation, vamos a hablar de la sostenibilidad digital en relación con JavaScript.

Así que les doy la bienvenida a mi charla, que he llamado Dead Script, el papel de JavaScript en la sostenibilidad web. Ahora, un poco de contexto. Esta grabación es el 17 de mayo, que es el aniversario de ECMA International, el organismo responsable de estandarizar JavaScript. Para aquellos que lo sepan, JavaScript alguna vez se llamó LiveScript por un breve momento. Así que pensé que Dead Script, LiveScript, era interesante. De todos modos, sigamos adelante. Mi nombre es Henri.

Me puedes encontrar en la mayoría de las redes sociales como Henri Helvetica.

Trabajo en esta increíble empresa llamada Catchpoint.

Y una de las cosas que hago en Catchpoint es hablar sobre el performance, y especialmente sobre esta fantástica herramienta que tenemos, que se llama Webpagetest, el estándar y la referencia en las pruebas de performance web.

Soy de la mejor ciudad del planeta, que se llama Toronto en Canadá.

También me gusta correr distancias cortas.

Así que me gusta usar el hashtag devs who run. Si tú también corres, siéntete libre de usarlo.

Bien, sigamos adelante.

Como mencioné hace un momento, hoy vamos a hablar sobre sostenibilidad.

Lo que no mencioné es que la sostenibilidad digital es bastante complicada.

Hay tantos factores. Es un poco como una ciencia inexacta.

Hay tantas partes móviles que deben ser consideradas, tanto grandes como pequeñas.

A veces no estás seguro de cómo encajarlo todo en esta ecuación cuadrática.

Pero necesitamos hablar de ello porque tiene mucho que ver con cómo se genera la electricidad, y eso influye en la conversación más amplia que vamos a tener hoy.

Pero esa electricidad también es la que alimenta las TIC, que son las tecnologías de la información y comunicación.

¿Qué son esas tecnologías?

Bueno, son realmente todas las tecnologías digitales que te rodean, o que dependen de teléfonos celulares, computadoras, laptops, televisores, internet, Wi-Fi, etc., etc., etc.

Así que las TIC están realmente a nuestro alrededor.

De hecho, las TIC utilizan el 7% de la electricidad a nivel mundial. Bastante impresionante.

De hecho, son responsables del 4% de las emisiones de CO2 a nivel mundial.

Eso es más que la industria de la aviación, e incluso más que algunos países por sí solos.

Bastante impresionante.

Pero al hablar de eso, también debemos hablar sobre cosas como los centros de datos, que son parte de las TIC, las redes y los dispositivos de consumo.

Como mencioné, la laptop en la que estoy grabando esta charla, el teléfono celular que no deja de sonar durante mi presentación, no sé.

La televisión en la que veo Netflix, o ESPN, o deportes, lo que sea.

Eso es todo TIC, y estamos rodeados de eso.

Otra cosa, muy importante a considerar, es la ubicación.

Sabes lo que dicen, ubicación, ubicación, ubicación, muy importante.

Bueno, esto es a lo que me refiero.

Ahora, si observas este mapa, es un mapa mundial de la intensidad de carbono de la electricidad en 2022. ¿Qué es la intensidad de carbono? Bueno, te lo diré ahora mismo. Es una medida de qué tan limpia es nuestra electricidad. Básicamente, si observas este mapa, las áreas más oscuras es donde probablemente están generando electricidad sucia, y las áreas más claras es donde pueden tener cosas como energía solar o energía eólica, que es mucho más limpia. Ahora, eso influye en tu huella de carbono.

Ahora, veamos este otro gráfico aquí, que es la intensidad de carbono de la electricidad de las naciones del G7. Y ves a Japón en la parte superior, pero por las razones equivocadas. Los países más limpios aquí son Canadá y Francia. Sabes, hay cosas realmente interesantes que están surgiendo en Francia, muchos estudios sobre emisiones y demás, que me sorprendieron un poco. No sabía que estaban tan involucrados en eso, pero es bueno saberlo. De todos modos, sigamos adelante.

Como he estado mencionando, existen múltiples formas de producir electricidad. Puedes quemar combustibles fósiles y tener lo que llamaremos electricidad sucia, o como dije, utilizar energía eólica y solar para que las cosas sean mucho más limpias. Y estas cosas influyen en tu huella de carbono. Una vez más, una ciencia inexacta. Entonces, esa electricidad alimenta los centros de datos que utilizamos. Los centros de datos que envían los recursos a través del cable hacia los dispositivos que utilizamos. Y en última instancia, todo eso influye en la huella de carbono, de lo que vamos a hablar hoy. Pero como mencioné antes, la sostenibilidad digital es realmente complicada. Ha habido discusiones muy animadas, a veces argumentos, sobre cómo tener en cuenta algunos de estos otros elementos en los cálculos de la huella de carbono. Pero en última instancia, muchos han acordado una métrica en particular. Nuevamente, no es la mejor, pero es la que se correlaciona más estrechamente, o muy bien, con las huellas de carbono y las emisiones. Y eso es el peso de la página. El peso de la página ha sido una métrica clásica de rendimiento. Ha existido durante bastante tiempo. Es una de las más fáciles de calcular. Es la cantidad de recursos que se envían a través del cable, y determinamos si son tantos kilobytes o tantos megabytes. Esperemos que no sean tantos. Eso se correlaciona muy bien con... El peso de la página se correlaciona muy bien con las emisiones de carbono, y vamos a hablar de eso hoy.

Lo que haremos hoy es analizar algunos data, y específicamente vamos a analizar data con respecto a JavaScript, y veremos cómo y dónde JavaScript influye en la conversación sobre la huella de carbono.

Muy bien, vamos. Ahora, solo un pequeño aviso, todo lo que... Todos los data que compartiré hoy se refieren principalmente a dispositivos móviles, y menciono esto todo el tiempo porque la sociedad prácticamente nos ha dicho que estamos en dispositivos móviles prácticamente todo el tiempo. Entonces, gran parte de los data que compartiré hoy se refieren realmente a dispositivos móviles.

Entonces, vamos. Veamos el peso de la página en el percentil 75. Es aproximadamente 4 megabytes. Bien, un tamaño un poco grande, está en el lado grande, pero realmente está ahí para comenzar a pintar el panorama. Ahora, si observamos las emisiones de carbono en dicho percentil P75, estamos hablando de 1.38 gramos de CO2 en el percentil 75. Ahora podemos comenzar a ver que, ok, una página de 4 megabytes, 1.38. Bien, más o menos entendemos lo que está sucediendo.

Ahora, en el percentil 75, nuevamente, se envía JavaScript a través del cable de 857 kilobytes. Bien, casi un megabyte de JavaScript en el percentil 75. En el percentil 90, estamos enviando más de un megabyte. De hecho, estamos enviando 1,367 kilobytes. Por cierto, estas estadísticas provienen del archivo de HP. Un tesoro fantástico de data que deberías leer, por cierto, pero ahora podemos comenzar a ver la cantidad de JavaScript que estamos enviando a través del cable.

Otra conversación importante es el hecho de que también podemos ver JavaScript no utilizado, que se envía a través del cable. Entonces, en el percentil 75, el 40% del JavaScript enviado a través del cable en realidad no se utiliza. Increíble. Para seguir con eso, en el percentil 90, vemos que el 44% del JavaScript enviado a través del cable no se utiliza. Nuevamente, ¿qué significa eso? Lo estamos enviando a través del cable. Lo estamos analizando, pero está ahí sin nada que hacer. Entonces, estamos viendo datos desperdiciados. De hecho, en el percentil 90, vemos más JavaScript no utilizado que JavaScript que se envía a través del cable en el percentil 50. Bien. Una vez más, estoy pintando este panorama de que hay mucho JavaScript no utilizado que se envía a través del... Se envía a través del cable, además del hecho de que estamos enviando mucho JavaScript a través del cable, en general. Y créeme, hay mucho más.

Entonces, veamos otro tipo de métrica clásica que solemos analizar de vez en cuando, que es el número de solicitudes. ¿Sabes cómo dicen en un clásico modus operandi, que la solicitud más rápida es aquella que nunca se hace? Bien, creo que eso es justo. Entonces, si extrapolamos esto a la sostenibilidad digital, la solicitud más ecológica es aquella que nunca se hace. ¿Qué significa eso? Bueno, si no vas a enviar la solicitud, lo más probable es que no necesites esa solicitud y casi con seguridad estás avanzando hacia un sitio más ecológico con una menor huella de carbono y, eventualmente, menos emisiones.

Pero veamos algunos data sobre las solicitudes. En el percentil 75, vemos 37 solicitudes solo para JavaScript. En el percentil 90, vemos un 62% más de solicitudes solo para JavaScript. Ahora, si retrocedemos un poco y nuevamente pensamos en la cantidad de JavaScript no utilizado que estamos enviando, podemos comenzar a hacer los cálculos y probablemente haya muchas solicitudes inútiles allí. Estas son cosas que quieres probar, quieres analizar y ver dónde puedes hacer algunas mejoras.

Acabamos de analizar algunos datos clásicos sobre el peso de la página. Y todo lo que hicimos realmente fue pintar la idea de que hay muchos recursos de JavaScript que se están enviando. Puede que te preguntes, ¿qué es todo esto, Ong? ¿Por qué estamos hablando del peso de la página en relación con JavaScript en una conversación sobre sostenibilidad? Bueno, te lo diré ahora mismo. Comienza con cosas como esta, la ecologización del gobierno. Bueno, este es un documento publicado por el gobierno del Reino Unido. Y básicamente están diciendo que están dando pasos hacia una mayor sostenibilidad, asegurándose especialmente de ser sostenibles digitalmente también. Aquí hay una cita que me gusta mucho: `El negocio como de costumbre ya no es una opción`. Por lo tanto, es vital que HMG, que creo que es el gobierno de su majestad, sus servicios digitales y TIC sean responsables y resilientes, el gobierno de su majestad. Ahí lo tienes. Perdón, me quedé en blanco. Así que ahí puedes ver que están anunciando abiertamente que se asegurarán de practicar las mejores medidas de sostenibilidad posibles. Ahora, más adelante en ese mismo documento, verás que hablan de asociarse con empresas que tienen en mente la sostenibilidad, que son abiertas con sus planes y eso significa que esencialmente se asociarán con personas afines. Entonces, si no tienes en cuenta la sostenibilidad o la sostenibilidad digital, es posible que el gobierno no sea uno de tus clientes. Estos son los tipos de cosas en las que queremos que pienses. Ahora, algo más de lo que quiero hablar es que la Unión Europea también está siguiendo estos pasos. De hecho, si buscas este documento llamado Directiva de Informes de Sostenibilidad Corporativa, la Unión Europea dice lo siguiente: `Las nuevas normas garantizarán que los inversores y otras partes interesadas tengan acceso a la información que necesitan para evaluar los riesgos de inversión derivados del cambio climático y otros problemas de sostenibilidad`. Una vez más, tienes otra gran organización que básicamente está diciendo lo siguiente: la sostenibilidad será una prioridad para nosotros. Y en su caso, a partir de 2024, los detalles están pendientes, pero parece que las organizaciones grandes, o las que tienen 250 personas o más, estarán obligadas a realizar informes de sostenibilidad para que puedan ver exactamente lo que están haciendo. Estas son cosas de las que deberías hablar, o al menos deberías pensar, y nosotros también hemos estado pensando en ello en Catchpoint.

De hecho, estábamos discutiendo la idea de proporcionar alguna métrica de sostenibilidad o tal vez una métrica o estimación de la huella de carbono junto con nuestros datos de rendimiento. Y básicamente decidimos hacerlo. Así que me gustaría presentarte algo que hemos lanzado llamado el control de carbono. Y eso es básicamente una estimación de tu huella de carbono que proporcionamos cuando haces una auditoría de rendimiento.

Ahora, se verá algo así, de hecho, ingresarás tu URL, presionarás ir y obtendrás tu resumen clásico de rendimiento como ves ahí. Entonces, lo que ves son las métricas de rendimiento de la página. TTFP, algunas de las métricas de pintura de las que hablé antes. Pero a la derecha, puedes ver que proporcionamos una estimación de tu huella de carbono. Lo llamamos un tipo de experimento, como un canario.

Si observas el resumen real del control de carbono, se verá algo así. Primero te diremos si estás utilizando un host ecológico, es decir, si tu host funciona con energía renovable. También analizaremos los mismos datos para tus dominios de terceros. ¿Están operando con energía renovable? Y te informaremos cuáles son y cuáles no lo son. Y finalmente te mostraremos la estimación de la huella de carbono junto con el peso de la página y lo que hemos calculado como una estimación decente de tu huella allí mismo. Ahora quiero agradecer a la Fundación GreenWeb porque en realidad estamos utilizando la biblioteca CO2GS y también su conjunto de datos GreenWeb para verificar los dominios. Si tienes curiosidad por ver eso, puedes ir a webpagesets.org/carbon-control. Es totalmente gratuito. Ni siquiera tienes que registrarte, aunque te recomendamos que lo hagas porque realmente puedes aprovechar algunas características adicionales. Pero aquí es donde podrás ver y obtener una estimación de tu huella de carbono junto con algunas de estas métricas de rendimiento. Y ¿por qué creemos que deben estar juntas? Bueno, básicamente están estrechamente relacionadas porque si vamos a hablar de información sobre el peso de la página y la huella de carbono y las emisiones, puedes ver que cuanto más peso tenga la página, mayores serán las emisiones, obviamente, bueno, realmente deberían estar bajo el mismo techo. Y eso es básicamente por qué sentimos que A, deben estar juntas. Y B, como dije, hemos estado revisando algunas de estas guías que estaban saliendo en términos de sostenibilidad y empresas que estaban comenzando a no tanto exigir, pero recomendar ser digitalmente sostenibles. Y sentimos que estas métricas pertenecen, como dije, juntas bajo el mismo techo. Dicho esto, en última instancia, también es bueno para el medio ambiente. Así que lo que me gustaría hacer para concluir es agradecerles mucho por escuchar. Si tienen alguna pregunta sobre lo que han escuchado hoy, por favor, háganmelo saber. Envíenme un tweet a Henri Albertca, estaré encantado de responder sus preguntas. De lo contrario, espero tener noticias suyas. Muchas gracias por su tiempo y que tengan un excelente día.