Elevando la Privacidad y Accesibilidad

♪♪♪ Olá y hola y bienvenidos a esta charla, Mejorando la Accesibilidad en la Aplicación de Privacidad. Es realmente genial estar aquí, como parte del Comité de la Cumbre de React. Esta es una historia de comunidad, porque hablaré sobre cómo creé, hace años, una biblioteca de componentes que, en el camino, con la ayuda de la comunidad, incorporamos la accesibilidad pero también la privacidad, convirtiendo esta biblioteca de componentes no solo en más accesible, sino con privacidad por defecto. Es realmente genial ser parte de esta comunidad global donde podemos compartir e intercambiar ideas, código, y ayudar a ofrecer una mejor experiencia de usuario. Creo que esto es parte de la magia del código abierto, y es la magia de conferencias como esta, que nos permite ver otras historias, ver nuevos desarrollos, y compartir lo que sabemos y ver lo que otras personas están construyendo allá afuera.

Soy Ibran Cesar. A veces solo me llaman Ibra. Soy un constructor de la comunidad de AWS. Soy un fanático explícito de TypeScript. Es mi herramienta principal para construir cualquier cosa. Y debido a eso, realmente soy, realmente un fanático de CDK. Es una forma de escribir tu infraestructura como código en tu lenguaje, como TypeScript en mi caso, pero podría ser Python y otros. Y creo que tiene el mismo potencial que jQuery cuando comenzó porque para mí, jQuery fue un punto de inflexión en la web porque permitió mucho a los desarrolladores front-end, y creo que CDK jugará el mismo papel en el espacio de la nube.

Pero basta de hablar de mí y de lo que veo o me gusta para la web en general. Comenzaré con una pequeña historia sobre por qué creé la biblioteca en el espacio de Flare. En 2018, tuve la suerte de estar en la Cumbre de la Web de Chrome. Fue una experiencia realmente genial donde pude ver y participar en la conferencia en San Francisco. Y uno de los momentos que más me sorprendió fue cómo estaban hablando de comenzar a observar cómo los usuarios realmente usan nuestras aplicaciones en lugar de, ya sabes, construir para nosotros mismos o, ya sabes, computadoras con alta potencia o teléfonos inteligentes de gama baja. Y para mí fue un poco difícil este tipo de discurso, porque en Brasil siempre tuvimos que desarrollar para este tipo de equipos. La gente usa teléfonos realmente básicos o teléfonos inteligentes muy básicos con capacidades limitadas. Así que ver que solo en 2018 estaban prestando atención a esto fue un poco impactante para mí, porque desde entonces siempre pensé que realmente estaban investigando esto. Pero de todos modos, fue un movimiento realmente genial, diría yo. Y vi con mucho cuidado que promovieron esta forma de respetar el hardware y la red de los usuarios, ambos problemas a los que nos enfrentamos aquí en Brasil todos los días, para que las personas accedan a información, servicios y cosas que les permitan acceder plenamente a Internet.

Estaba resolviendo eso y pensando en todos los problemas que tenía todos los días para construir una aplicación para entregar noticias a las personas aquí en Brasil. Teníamos este sitio web realmente grande con muchos componentes en la página principal, teníamos más de 150 piezas de contenido que iban desde imágenes, texto, títulos y cosas así, y teníamos solo un iframe de YouTube. Estaba buscando obtener la mejor puntuación en Lighthouse y cosas así, y estaba resolviendo algo de lo que no estaba realmente seguro si era culpa mía, y estaba pensando para mí mismo, creo que el problema es el iframe, pero al mismo tiempo estaba pensando, bueno, ellos son Google, ¿verdad?, ellos no proporcionarán algo que, ya sabes, disminuya mi rendimiento. Entonces, es obvio que es algún tipo de error por mi parte, pero esto no es lo que realmente es cierto.

Como se señaló en el mismo evento, el iframe de YouTube tiene una carga enorme, no solo carga los scripts para el video en sí, sino también para la red de publicidad, para el seguimiento que necesitan y otros tipos de tareas que deben ejecutarse en el hilo principal, lo que pone una carga pesada en el hilo único y ralentiza por completo el sitio web, incluso el lugar que estábamos colocando en nuestra página de inicio. Y en el mismo evento presentaron estos componentes web que llamaron Light YouTube. Light YouTube era una forma de proporcionar videos realmente enfocados en el rendimiento. Era más de 200 veces más rápido que la carga de la página con el uso de este elemento personalizado. ¿Qué hace? En realidad, lo que hace es tomar la imagen para un ID de video, porque puedes obtener estáticamente la imagen para un video si conoces el ID, y solo coloca la imagen y carga el iFrame solo cuando los usuarios quieren interactuar con él, con el mouse y el botón de reproducción. Entonces, cuando el usuario inicia estas acciones, en segundo plano comienza a cargar el iFrame y presenta al usuario el video que desean ver. Pero todas las URIs se cargan con la directiva Per-Load, lo que deja el hilo único libre para que su página se cargue más rápido.

Y debido a eso, desde que regresé a Brasil, comencé a portarlo a React, porque para mí era realmente algo que me molestaba. Y creo que sería realmente genial compartir este tipo de trabajo con otras personas. Esa presentación de Paul Irish fue realmente genial para mí y me mostró, ya sabes, el camino hacia el código abierto. Desde entonces, solo estaba trabajando en algunos problemas menores de paquetes de otras personas, pero desde que publiqué esta pequeña biblioteca, cada vez más estoy creando mis propias bibliotecas y componentes. Y ¿por qué es tan importante de lo que estoy hablando? Creo que una de las cosas que desde el principio, coloqué en la biblioteca fue, ya sabes, hacer cumplir algún tipo de mejor práctica, como, ya sabes, tenía un ID para obtener el ID del video que se usa tanto en la referencia de imagen como en la ruta y el título, porque para generar y que la imagen sea más accesible, debe ser un texto alternativo. Entonces, a propósito, hice que fuera obligatorio no solo poner el ID sino también el título porque creo que cuando implementamos este tipo de rieles anchos, hacemos una mella en la forma en que los desarrolladores abordan sus implementaciones.

Algunos meses después de mi primer lanzamiento, recibí esta solicitud de extracción en la que un usuario agregó esta opción para usar un modo de mejora de privacidad. Utiliza una directiva de no-cook que YouTube proporciona para que las personas decidan si quieren o no que su iFrame obtenga información de usted en ese lugar porque está en el sitio web de otra persona y no desea que, ya sabes, Google omita el seguimiento de las personas allí o la persona que estaba en nuestro sitio web en ese momento no quiere ser rastreada. Es una opción que las personas deberían tener, ¿verdad? Y no sabía que existía este tipo de opción antes de esta solicitud de extracción. Pero desde que la recibí, no solo la vi como una buena opción, sino que meses después decidimos poner esto no solo como una opción, sino definido a propósito como una privacidad predeterminada. Porque hay este libro, Noti, que habla sobre cómo las personas reaccionan en una conferencia de React. Es algo divertido de decir. Pero Noti habla sobre cómo los pequeños valores predeterminados pueden ayudar a las personas a tomar una mejor decisión para la comunidad en su conjunto. Como si las personas donaran sangre por defecto, o sus órganos, en ese sentido, de hecho, el país tendría más donantes porque si las personas tuvieran que decir prácticamente: quiero ser donante de órganos, no lo harían y dirían menos, no quiero ser donante. Entonces, solo las personas que realmente se oponen a ser donantes de órganos podrán tener esta opción. Pero, inducir a las personas a tomar mejores decisiones para el bien de todos, es el propósito de crear este tipo de barreras de protección. Y otra cosa, fue un problema que un usuario abrió, ya sabes, encontró un error de blanqueo SSS en la biblioteca que estaba usando un GV cuando necesitaba usar un botón, es un problema muy común. Y siempre uso el elemento correcto y tengo que, ya sabes, poner algo en su lugar para que el contenedor no sea interactivo y para mí fue realmente genial ver los comentarios de la comunidad después de solucionar el problema, porque no solo las personas, no solo una persona, ya sabes, se quejaba y cómo con poco esfuerzo a veces podemos marcar una gran diferencia en la experiencia de alguien. Y para mí, mostrar cómo esta frase es realmente genial para pensar en cada decisión que tomamos en nuestros componentes, en nuestras aplicaciones y cómo podemos comenzar a pensar en mejores formas de proporcionar una mejor experiencia de usuario desde cero, desde nuestros componentes, como en esta biblioteca. Las buenas intenciones nunca funcionan. Necesitas buenos mecanismos para hacer que cualquier cosa suceda. Creo que esta es una gran cita de Jeff Bezos, porque habla de que todos tenemos buenas intenciones, ¿verdad? No creé mi biblioteca pensando en usar Jib solo porque sí, no quiero ser