Hagamos que la web sea grandiosa nuevamente

imagen

La web moderna es un sistema dinámico complejo que está constantemente en movimiento. Como se señala en muchos artículos, se hace muy difícil realizar un seguimiento de todos los cambios a medida que aparecen nuevas herramientas y marcos casi todos los días. El conocimiento se vuelve obsoleto incluso antes de tener un punto de apoyo. Por supuesto, todo esto es un resultado obvio del rápido desarrollo y crecimiento, pero esto inevitablemente agrega complejidad a los desarrolladores web y aumenta el umbral para ingresar a la profesión.

Llega al punto de lo absurdo que primero tiene que configurar babel, luego webpack, y luego lidiar con la configuración específica del marco elegido para crear un formulario de entrada de datos de usuario simple ... Y esto es probablemente demasiadas palabras nuevas para un recién llegado al equipo al que se le encomendó esta tarea de aspecto simple. . No, lo más probable es que el proyecto ya esté configurado y configurado, y el principiante ciertamente no se quedará solo a merced del destino diciéndole brevemente para qué. Pero vale la pena reconocer que realmente se ha vuelto demasiado complicado y parece que pasamos una parte significativa del tiempo en todos estos sistemas de compilación y luchamos con la configuración.

Pero intentemos recordar: ¿siempre ha sido así? ¿Los creadores de la web soñaban con un futuro así? ¡No, maldita sea, y de nuevo no! Después de todo, algunos nadie, a menudo feo, lleno de trucos y trucos, pero la web era diferente, ¡simple y comprensible! Aquí hemos agregado un script, aquí hay un estilo y aquí está nuestro diseño de página. Entonces, ¿qué salió mal? ¿Realmente todo se ha vuelto tan malo? Después de todo, javascript y toda la web solo crecieron y mejoraron, el lenguaje se hizo más fuerte y más expresivo, apareció la modularidad, la ventaja de varias plantillas arquitectónicas se hizo evidente y, sin embargo, ¿dónde está esa simplicidad anterior? ¿Realmente la hemos perdido para siempre?

imagen
(Magnífico hombre araña)

La respuesta es realmente bastante simple y directa. La web realmente ha crecido y se ha vuelto más complicada, ahora no es raro encontrar una aplicación multimedia completamente escrita para tecnología web o un juego 3D en un navegador, que era impensable hace 10 años. Pero el problema principal es que a menudo queremos de la web que aún no está listo para darnos: las últimas tecnologías y estándares, plantillas arquitectónicas experimentales, todo es lo más nuevo y más moderno y, por supuesto, debería funcionar en todas partes y para todos, y por favor rápidamente . Y luego una pandilla salvaje liderada por webpack aparece en la escena y comienza a corregir la pelota. Y ahora ya está colgado con configuraciones complejas y su proyecto dura aproximadamente un minuto y medio y pesa cincuenta megabytes. Finito la comedia. La lucha con la configuración comienza en un intento de exprimir un poco más el rendimiento y reducir el tamaño. Y luego, qué tipo de desarrollo e implementación de ideas se puede discutir, si pasamos la mayor parte del tiempo en la configuración de la línea de montaje. ¿Admitir quién es su equipo experto en webpack?

imagen

No estamos tan acostumbrados a esto, sino que hemos llegado a un acuerdo de que esto es normal, pero ¿de qué otra manera? Estábamos colgados con tipos y marcos, corporativismo, seguridad, ni siquiera puedes pelear. Pero, ¿a dónde fue esta facilidad y simplicidad del experimento, para lo cual se concibió este lenguaje dinámico débilmente tipado? Y todo, no el de ella, desapareció bajo las montañas de bultos y empresas. ¿Pero realmente no se puede hacer nada?

Vale la pena detenerse y pensar, pero ¿qué estamos haciendo y por qué? Después de todo, si usamos webpack, rollup, parcel (subrayado según sea necesario) y creamos todos estos paquetes ilegibles que no se pueden depurar más tarde incluso con mapas de origen, entonces seguramente alguien necesita esto, ¿verdad? Sí, todo es así, para una producción rápida y efectiva a partir de paquetes que no puede obtener en ningún lado e incluso el nuevo HTTP2 no ha hecho la tarea mucho más fácil. Es por eso que los desarrolladores empacan en la oficina durante las largas tardes de otoño, permanecen más tiempo en el trabajo y queman cientos de miles de kilovatios de energía, empacan en departamentos, empacan en compañías, empacan en todo el mundo transmitiendo un cambio con el movimiento del sol. Simplemente sucedió, y tal es la ley. Dura lex, sed lex. Entonces, la verdadera pregunta de Shakespeare es culpar o no culpar: muere antes de que tenga tiempo de romper los labios del joven Hamlet que abrió el estudio visual para acumular otra obra maestra.

imagen
(Muy bien)

Pero espera, dijiste que todo esto es necesario para la producción, pero ¿qué pasa con el desarrollo? ¿Por qué es imposible desarrollarse cómodamente como en los viejos tiempos, simplemente iniciando el servidor y empacando todo antes de enviarlo a producción? ¿Y por qué generalmente usamos las mismas herramientas para la producción y el desarrollo? ¿Por qué no utilizar una solución diseñada específicamente para el desarrollo, porque lo que estamos haciendo no es particularmente lógico?

Y esto realmente no es lógico, y preferimos hacerlo en ausencia de alternativas, o simplemente porque estamos acostumbrados. Pero, ¿y si digo que tienes una opción?

imagen

Meet hq : un servidor especializado para desarrollar aplicaciones web. hq es un servidor estático con esteroides que comprende todo lo que un servidor normal no puede manejar. ¿Desea la última característica del estándar javascript, pero su navegador aún no lo admite? - por favor! Su biblioteca utiliza el formato commonjs, ¡no hay problema! Abajo, con las diversas herramientas afiladas para trabajar con cada marco específico, hq las admite a todas, desde el primer momento. hq es tan genial que no requiere ninguna configuración, simplemente funciona y hace su trabajo. Sin paquete, todo es diferente al suyo, hq REALMENTE no requiere ninguna configuración, simplemente no existe, por lo que no hay a dónde ir. Instalarlo una vez

npm install -g @hqjs/hq

y luego ejecutar con un comando en la raíz del proyecto para comenzar a experimentar de inmediato

hq

Bueno, dices, la vieja pandilla nos ofreció casi lo mismo, bueno, quizás un poco más de configuración, un poco menos simple, pero todo es muy similar, entonces, ¿por qué necesitamos este nuevo Chuck Norris en el mundo de las vírgenes? Y luego te responderé con el nuevo lema de la casa Greyjoy: "¡No somos un bandido!". ¡Sí, de hecho, no somos gángsters!

imagen
(Casa Greyjoy. No sembramos Bundlem)

Hola, he estado involucrado en el desarrollo web desde que tenía 13 años y comencé a golpear cuando tenía 19 años. Mi amigo me enganchó a esto cuando fui a su garaje donde golpeó días y noches por volar. Te pregunte que haces Y dijo que esto es algo nuevo, que ahora está muy de moda y es genial, y definitivamente tengo que intentarlo. Al principio solo pegué los archivos, y luego probé un pequeño paquete con el compilador de cierre y luego no pude parar. trago, browserify, y luego webpack ... Mis paquetes se volvieron más difíciles. No sabía cómo parar, caí en un ciclo que no me permitía irme. Cada vez que llegaba a un nuevo proyecto, alguien ya estaba golpeando allí y era simplemente imposible rechazarlo. ¡Ningún bandido no era prestigioso! La gente de la profesión e incluso amigos cercanos se negaron a comunicarse y no me volvieron a llamar cuando descubrieron que quería parar. Así que no había a dónde ir. Pero ahora estoy limpio! ¡Ya no soy un bandido durante el desarrollo! Mis amigos y conocidos dejaron de jugar conmigo, ahora esto no es aceptado en nuestra empresa. ¿Y sabes que? ¡Nunca me he sentido tan bien! El mundo finalmente comenzó a jugar con nuevos colores y el tiempo comenzó a ser tanto en el trabajo como en la familia.

En serio, la falta de paquetes simplifica enormemente la vida. ¡Recuerde situaciones insoportables cuando es imposible poner un punto de quiebre no solo en la expresión, sino incluso en la línea deseada! O estos nombres de variables generados por webpack __webpack __ @ #% ^ $ !!! Cuando los lees, no es sorprendente llamar a Satanás, pero no quieres escribirlos a la consola y al enemigo, y qué es lo más opuesto que están ocultos detrás de los nombres humanos normales, así que adivina qué más. En general, la depuración a menudo se convierte en un infierno, incluso con mapas fuente completos. ¿Cuántas veces al día juras código dentro de node_modules? ¿Cuántas maldiciones están cayendo sobre la cabeza de los desafortunados desarrolladores de React y Angular porque es imposible entender el mensaje de error y dónde ocurre este error? Después de cambiar a hq, olvidamos todo esto como una pesadilla. Realmente hay más tiempo, ahora no tienes que descifrar por qué no funciona o simplemente no funciona en silencio y de dónde obtuvimos esta biblioteca con diez megabytes en la compilación, ¡ahora puedes ver claramente dónde! Ha habido menos sufrimiento, el trabajo se ha vuelto más fácil y resulta ser un placer.

imagen
(Esta persona es Varg o piel cambiante, puede penetrar en la conciencia de los animales. Ahora se eleva con el águila, buscando al enemigo)

La mejor parte es que hq no parece algo nuevo y complejo, parece que siempre ha estado con nosotros, todo es muy simple y familiar. hq es un servidor estático que solo te entiende. El inicio de un nuevo proyecto se vuelve increíblemente rápido, un comando en la consola y puede comenzar a experimentar. Marcos, bibliotecas, formatos, enfoques arquitectónicos: ¡todo esto ya no crea barreras, con hq todo funciona como en los viejos tiempos, de forma rápida, simple y lógica! Además, el proyecto de código abierto hq para que siempre pueda mejorar algo o agregar soporte para algún formato nuevo.

Francamente, encontramos fallas. Anteriormente, cuando construir con webpack tomaba varios minutos, era una excusa maravillosa para buscar en la cocina una taza de café aromático, pero ahora todo funciona tan rápido que simplemente no hay tiempo para esto. Aunque, ¿hay alguna necesidad de buscar una excusa para un buen café?

imagen

¿Cómo funciona todo esto? Esto puede dar la impresión de que hq es un monstruo pesado tejido por el Dr. Frankenstein a partir de una variedad de partes diferentes e incoherentes sazonadas con un poco de magia negra. Pero, de hecho, todo es bastante armonioso y uniforme. hq distribuye cada archivo individualmente a pedido, tal como lo hace un servidor estático normal. Esto nos da solo una oportunidad limitada para deshacernos del código no utilizado, sin sacudidas completas del árbol, pero ahorra mucho tiempo que se dedicó al análisis de dependencia. Todas las transformaciones ocurren instantáneamente y sobre la marcha. Además, solo se transforma el mínimo necesario. Si utiliza un navegador moderno y se adhiere a los estándares web, es poco probable que su código se altere en absoluto. Si bien puede confiar en los estándares, no hay garantía de que las bibliotecas a las que está acostumbrado hagan lo mismo. La mayoría de ellos probablemente se entregarán en formato commonjs, lo que no les permite trabajar en el navegador tal como está. hq se encarga de esto y convierte los módulos commonjs a formato ESM, procesa importaciones no estándar pero bastante comunes (como css o json) y destruye objetos importados cuando es necesario. hq funciona en conjunto con un navegador web, utilizando su sistema de almacenamiento en caché para acelerar la entrega de activos y transferir solo archivos que han sido modificados. Recargará automáticamente la página cuando cambie su código para que pueda evaluar instantáneamente el resultado de los cambios. hq puede funcionar con muchos marcos, pero no depende de su código. En cambio, hq realiza una serie de transformaciones AST utilizando complementos de babel que se crearon específicamente para hq para que pueda comprender y transformar la variedad de tecnologías y enfoques utilizados en el desarrollo en un único estándar compatible con el navegador.

Por lo tanto, a pesar de todas las dificultades y desafíos que presenta la web moderna, el desarrollo de proyectos puede seguir siendo simple e intuitivo, tal como lo fue en los albores de la tecnología web. ¡Pruebe hq ahora para mejorar su experiencia de desarrollo en un proyecto antiguo, o úselo para crear un nuevo proyecto emocionante!

npm install -g @hqjs/hq

Source: https://habr.com/ru/post/es428864/


All Articles