Hacker News

Mostra HN: Vertex.js – A 1kloc SPA Framework

Comentaris

13 min read Via lukeb42.github.io

Mewayz Team

Editorial Team

Hacker News
Aquí teniu l'article:

L'auge dels microframeworks: per què els desenvolupadors rebutgen les eines de JavaScript inflades

Recentment, un desenvolupador va publicar un marc d'aplicació d'una sola pàgina construït amb unes 1.000 línies de codi a Hacker News, i la resposta va ser elèctrica. El projecte, un marc minimalista SPA, va tornar a encendre un debat que fa anys que s'estén a la comunitat de desenvolupament web: s'han tornat massa complexes les nostres eines per als problemes que resolen? Quan la biblioteca bàsica de React, el seu encaminador, la seva capa de gestió d'estat i les seves eines de creació col·lectivament pesen centenars de milers de línies de codi, un marc que ofereix encaminament, reactivitat i representació de components en només 1.000 línies obliga a una pregunta incòmoda. Per a les empreses que creen aplicacions orientades al client, la resposta a aquesta pregunta té conseqüències reals: temps de càrrega, productivitat dels desenvolupadors i costos de manteniment a llarg termini.

Què demostra realment un marc de 1.000 línies

La idea d'un micromarc no és nova. Backbone.js tenia aproximadament 1.800 línies de codi font anotat quan es va estrenar l'any 2010. Mithril.js s'envia amb gzipped inferior a 10 KB. El que fa que cada nova entrada d'aquesta categoria sigui remarcable no és el recompte de línies en si, sinó el que revela sobre l'estat actual de les API del navegador. Els navegadors moderns s'envien amb suport natiu per a literals de plantilla, l'API History, reactivitat basada en proxy, elements personalitzats i càrrega de mòduls. Fa una dècada, els frameworks necessitaven milers de línies només per normalitzar les diferències entre Internet Explorer i Chrome. Avui dia, un desenvolupador expert pot crear un marc SPA totalment funcional com una capa d'orquestració fina a sobre de les primitives de la plataforma.

Això és important perquè canvia la conversa de "quin marc hem de triar?" a "Necessitem un marc?" Per a projectes petits i mitjans —una pàgina de destinació amb seccions dinàmiques, un tauler intern, un portal de clients— la resposta és cada cop més: potser no, o almenys no pesada. El marc de 1.000 línies és una prova que la plataforma ha madurat fins al punt que la feina del marc s'està reduint.

Per descomptat, marcs com React i Vue encara guanyen el seu pes en aplicacions a gran escala amb arbres d'estat complexos, necessitats de renderització del servidor i equips de més de 20 desenvolupadors que es beneficien de convencions rígides. La idea clau és que l'eina adequada depèn completament de l'abast del problema.

El cost real de JavaScript Bloat

La investigació de Google ha demostrat constantment que cada 100 mil·lisegons de temps de càrrega afegit pot reduir les taxes de conversió fins a un 7%. La pàgina web mitjana inclou ara més de 500 KB de JavaScript, una xifra que gairebé s'ha triplicat des del 2015. Per a les empreses, aquesta no és una mètrica de rendiment abstracta. Es tradueix directament en ingressos perduts, percentatges de rebot més elevats i pitjors rànquings en els motors de cerca.

El problema s'agreuja a les xarxes mòbils. Un usuari d'un dispositiu Android de gamma mitjana que es connecta a través de 3G pot esperar entre 5 i 8 segons perquè una pàgina amb una gran quantitat de JavaScript es torni interactiva, fins i tot després que s'hagi representat l'HTML inicial. Això és especialment castigador per a les empreses que donen servei als clients en mercats emergents, on la navegació amb el mòbil és la norma i la infraestructura de xarxa varia enormement.

  • Temps d'anàlisi: els grans paquets de JavaScript triguen més a analitzar i compilar, fins i tot abans que s'executi una única línia de codi de l'aplicació
  • Pressió de memòria: els components interns del marc complex consumeixen memòria que la mateixa aplicació podria utilitzar
  • Cansament de l'actualització: les actualitzacions importants del marc (Angular 1 a 2, Vue 2 a 3, components de la classe React als ganxos) obliguen a costosos esforços de migració cada 2-3 anys
  • Cadenes de dependència: la carpeta node_modules d'un projecte de React típic conté entre 800 i 1.200 paquets, cadascun d'ells una possible vulnerabilitat de seguretat o un canvi de ruptura
  • Crear complexitat: Webpack, Babel, PostCSS i els seus fitxers de configuració sovint superen el codi de l'aplicació que serveixen

Els micromarcs eviten la majoria d'aquests costos. Amb menys abstraccions, hi ha menys coses per trencar, menys dependències per auditar i menys bytes per enviar al navegador. Per a una empresa que necessita una presència web ràpida i fiable sense un equip d'infraestructura frontal dedicat, les matemàtiques afavoreixen cada cop més la simplicitat.

Per què la comunitat de desenvolupadors està dividida

La discussió de Hacker News sobre petits marcs SPA genera de manera fiable dos camps oposats. D'una banda, hi ha desenvolupadors que han passat anys en grans bases de codi construïdes sobre React o Angular i han vist de primera mà com la complexitat del marc es composa amb el temps. Han observat que les funcions senzilles s'incorporen a tasques de diversos dies perquè les convencions del marc requereixen una configuració de l'encaminador, un boilerplate de gestió de l'estat i arnesos de prova que es burlen dels elements interns del marc. Per a aquests desenvolupadors, un marc de 1.000 línies representa l'alliberament: un retorn a la comprensió de cada línia de codi que s'executa a la seva aplicació.

A l'altra banda, hi ha pragmàtics que assenyalen que els marcs existeixen perquè les aplicacions del món real eventualment necessiten el que proporcionen: utilitats d'accessibilitat, internacionalització, divisió de codi, representació al costat del servidor i un canal de contractació de desenvolupadors que ja coneixen l'eina. Un micromarc pot ser un plaer per a un projecte de cap de setmana, argumenten, però proveu d'incorporar un equip de cinc persones a una base de codi personalitzada de 1.000 línies sense respostes de Stack Overflow i sense documentació oficial.

Ambdues parts tenen punts vàlids, i el cert és que l'elecció és contextual. Un fundador en solitari que construeix un MVP té necessitats fonamentalment diferents de les d'un equip empresarial que manté una aplicació de cinc anys. El perill rau en aplicar solucions empresarials als problemes d'inici o eines d'inici als reptes empresarials.

El que realment necessiten les empreses modernes de la seva pila tecnològica

El debat marc és, en última instància, un indicador d'una pregunta més àmplia: com haurien d'assignar les empreses els seus recursos tècnics limitats? Cada hora que un desenvolupador passa a configurar un pipeline de compilació o a migrar a una nova versió del marc és una hora que no es dedica a crear funcions que serveixen als clients. Per a moltes empreses, especialment les petites i mitjanes operacions, l'opció tecnològica ideal és aquella que minimitza la diferència entre "Tinc una idea" i "els clients l'utilitzen".

La millor decisió tecnològica que pot prendre una empresa en creixement és triar eines que resolguin els problemes actuals sense generar la càrrega de manteniment de demà. Tant si això significa un marc de 1.000 línies com una plataforma totalment gestionada, l'objectiu és el mateix: dedicar el teu temps a allò que fa que el teu negoci sigui únic, no a la infraestructura que cada empresa necessita.

Aquest principi s'estén més enllà dels marcs d'interfície. Les empreses reconstrueixen habitualment els mateixos sistemes de backend (autenticació d'usuaris, processament de pagaments, CRM, facturació, programació) perquè la seva pila tecnològica escollida ho exigeix. Plataformes com Mewayz existeixen precisament per eliminar aquest treball repetitiu, oferint 207 mòduls preconstruïts que cobreixen tot, des de CRM i nòmines fins a sistemes de reserves i analítiques. La mateixa filosofia que impulsa els desenvolupadors cap a micromarcs (fer més amb menys, eliminar la complexitat innecessària) impulsa les empreses cap a plataformes consolidades que substitueixen desenes de subscripcions SaaS per un sol sistema.

💡 DID YOU KNOW?

Mewayz replaces 8+ business tools in one platform

CRM · Invoicing · HR · Projects · Booking · eCommerce · POS · Analytics. Free forever plan available.

Start Free →

L'espectre del marc: trobar el vostre punt dolç

En lloc de tractar l'elecció del marc com a binària (mega-marc o micro-marc), ajuda a pensar en termes d'espectre. En un extrem, teniu JavaScript vainilla amb zero abstraccions. A l'altra, teniu metaframes de pila completa com Next.js o Nuxt que gestionen l'encaminament, la representació, l'obtenció de dades i el desplegament. La majoria dels projectes pertanyen a un lloc intermedi.

Per a un lloc de màrqueting orientat al client amb uns quants elements interactius, un microframework o fins i tot una reactivitat en línia d'estil Alpine.js pot ser l'ajustament perfecte. Per a un tauler de control SaaS complex amb dades en temps real, permisos basats en rols i suport fora de línia, val la pena un marc madur amb un ecosistema ric. L'error és optar per defecte a l'opció més pesada perquè és la més popular, o predeterminar a la més lleugera perquè és la més satisfactòria intel·lectualment.

La prova pràctica és senzilla: enumereu totes les funcions que necessita la vostra aplicació durant els propers 12 mesos. Si un micromarc cobreix el 90% d'aquestes necessitats i podeu tirar a mà el 10% restant en menys temps del que gastaríeu configurant un marc més gran, el micromarc guanya. Si la vostra llista de funcions inclou la representació del servidor, la validació de formularis complexos, l'orquestració d'animacions i un suport d'accessibilitat profund, és probable que el marc més gran es pagui per si sol.

Lliçons per a fundadors i operadors empresarials no tècnics

Si tens una empresa i el teu equip tècnic està debatint marcs, això és el que realment importa. En primer lloc, pregunteu sobre el temps per a la primera funció: amb quina rapidesa pot un nou desenvolupador de l'equip enviar un canvi significatiu? Si la resposta implica dies de configuració de l'entorn i aprenentatge del marc, aquest és un senyal d'advertència independentment del marc escollit. En segon lloc, pregunteu sobre la ruta d'actualització. Els marcs que alliberen canvis de ruptura cada 18 mesos imposen un impost ocult que rarament apareix a l'avaluació inicial.

En tercer lloc, i el més important, pregunteu si necessiteu programari personalitzat per a la funció en qüestió. Moltes empreses inverteixen mesos de temps de desenvolupament per crear eines internes (taulers de comandament, sistemes CRM, fluxos de facturació, interfícies de programació) que ja existeixen com a productes polits i cuidats. Una plataforma com Mewayz, que dóna servei a més de 138.000 usuaris amb mòduls que abasten tot l'espectre d'operacions empresarials, pot eliminar completament la necessitat de desenvolupament personalitzat per a funcions empresarials estàndard. Això allibera el vostre equip de desenvolupament per centrar-se en els aspectes realment únics del vostre producte: les funcions que cap eina comercial no pot oferir.

  1. Auditeu el vostre codi personalitzat: identifiqueu quines eines internes dupliquen la funcionalitat disponible a les plataformes existents
  2. Calculeu el cost real: tingueu en compte no només el desenvolupament inicial, sinó també el manteniment continu, els pedaços de seguretat i les sol·licituds de funcions
  3. Avaluació de la consolidació: Compteu les vostres subscripcions SaaS actuals i compareu el cost amb una plataforma integrada
  4. Protegiu els vostres diferenciadors: reserveu recursos de desenvolupament personalitzats per a funcions que realment distingeixin la vostra empresa

El futur pertany a les eleccions intencionades

L'emoció al voltant d'un marc SPA de 1.000 línies no es refereix realment al marc en si. Es tracta d'un moviment creixent en el desenvolupament de programari cap a la intencionalitat: triar eines perquè s'adapten al problema, no perquè dominen el mercat. L'ecosistema JavaScript ha passat l'última dècada en una carrera armamentística de característiques i abstraccions. El moviment contrari, representat per microframeworks, HTML representat al servidor i API natives de la plataforma, és una correcció cap al pragmatisme.

Per a les empreses, aquest canvi és inequívocament positiu. Significa més opcions, costos de canvi més baixos i una cultura de desenvolupadors que valora cada cop més la simplicitat i la velocitat per sobre de la integritat teòrica. Tant si sou un emprenedor en solitari que trieu entre WordPress i un lloc personalitzat, o un CTO que avalua si voleu crear o comprar la vostra propera eina interna, s'aplica el mateix principi: la millor tecnologia és la que desapareix en un segon pla i us permet centrar-vos en servir els vostres clients.

El marc de 1.000 línies ens recorda que el poder no requereix complexitat. Les empreses més efectives, i les eines més efectives, són les que fan exactament el que es necessita i res més.

Racionalitza el teu negoci amb Mewayz

Mewayz incorpora 207 mòduls empresarials en una plataforma: CRM, facturació, gestió de projectes i molt més. Uneix-te a més de 138.000 usuaris que han simplificat el seu flux de treball.

Comença gratis avui →

Preguntes més freqüents

Què és un microframework com Vertex.js?

Un microframework és una biblioteca minimalista de JavaScript dissenyada per gestionar les tasques bàsiques d'aplicacions sense el gruix de solucions més grans. Vertex.js ho aconsegueix proporcionant una funcionalitat SPA essencial, com ara l'encaminament i la gestió de l'estat, en unes 1.000 línies de codi. Això contrasta amb els marcs que requereixen biblioteques separades i més pesades per a l'encaminament o l'estat, la qual cosa redueix la complexitat general i l'extensió per a projectes més petits.

Per què els desenvolupadors es mouen cap a eines més senzilles?

Molts desenvolupadors consideren que les eines JavaScript modernes s'han tornat massa complexes per al projecte mitjà. Els marcs pesats poden introduir temps de construcció lents, una corba d'aprenentatge pronunciada i funcions innecessàries. Eines més senzilles com Vertex.js ofereixen una experiència de desenvolupament més ràpida i comprensible centrant-se en els problemes essencials que ha de resoldre un marc, alineant-se millor amb els requisits reals del projecte.

Vertex.js és adequat per a una aplicació gran i complexa?

Vertex.js està dissenyat principalment per a projectes més petits on la senzillesa i la poca sobrecàrrega són clau. Per a aplicacions molt grans i complexes amb molts components interactius, pot ser més apropiat un marc més ric en funcions amb un ecosistema ampli. Per als equips que necessiten amplis mòduls preconstruïts, un servei com Mewayz (ofereix 207 mòduls per 19 dòlars al mes) podria proporcionar la interfície d'usuari i els components funcionals necessaris que no tenen un microframe.

Encara necessito una eina de compilació amb Vertex.js?

Tot i que Vertex.js en si és lleuger, és probable que encara feu servir una eina de creació per al desenvolupament professional. Eines com Vite o Parcel són necessàries per agrupar el vostre codi, gestionar les dependències de npm i habilitar les funcions modernes de JavaScript. Tanmateix, la cadena d'eines en general segueix sent més senzilla que les requerides per marcs més grans, ja que eviteu biblioteques complexes de gestió de l'estat i d'encaminament.

Try Mewayz Free

All-in-one platform for CRM, invoicing, projects, HR & more. No credit card required.

Start managing your business smarter today

Join 30,000+ businesses. Free forever plan · No credit card required.

Ready to put this into practice?

Join 30,000+ businesses using Mewayz. Free forever plan — no credit card required.

Start Free Trial →

Ready to take action?

Start your free Mewayz trial today

All-in-one business platform. No credit card required.

Start Free →

14-day free trial · No credit card · Cancel anytime