Prikaži HN: Vertex.js – ogrodje 1kloc SPA

Vzpon mikro ogrodij: zakaj razvijalci zavračajo napihnjena orodja JavaScript

Razvijalec je nedavno za Hacker News objavil enostransko ogrodje aplikacije, sestavljeno iz približno 1000 vrstic kode, in odziv je bil električen. Projekt – minimalistično ogrodje SPA – je znova sprožil razpravo, ki že leta tle v skupnosti spletnih razvijalcev: ali so naša orodja postala preveč zapletena za probleme, ki jih rešujejo? Ko Reactova osnovna knjižnica, njen usmerjevalnik, njena plast za upravljanje stanja in njena orodja za gradnjo skupaj tehtajo več sto tisoč vrstic kode, okvir, ki zagotavlja usmerjanje, reaktivnost in upodabljanje komponent v samo 1000 vrsticah, povzroči neprijetno vprašanje. Za podjetja, ki izdelujejo aplikacije, namenjene strankam, ima odgovor na to vprašanje resnične posledice – v času nalaganja, produktivnosti razvijalcev in dolgoročnih stroških vzdrževanja.

Kaj 1000-vrstični okvir dejansko dokazuje

Zamisel o mikro ogrodju ni nova. Backbone.js je obsegal približno 1800 vrstic označene izvorne kode, ko je debitiral leta 2010. Mithril.js se pošilja z manj kot 10 KB gzipanega. Zaradi česar je vsak nov vnos v tej kategoriji omembe vreden, ni samo število vrstic, ampak to, kar razkrije o trenutnem stanju API-jev brskalnika. Sodobni brskalniki so opremljeni z izvorno podporo za literale predloge, zgodovinski API, odzivnost na podlagi proxyja, elemente po meri in nalaganje modulov. Pred desetletjem so ogrodja potrebovala na tisoče vrstic samo za normalizacijo razlik med Internet Explorerjem in Chromom. Danes lahko izkušen razvijalec zgradi popolnoma funkcionalno ogrodje SPA kot tanko orkestracijsko plast na vrhu primitivov platforme.

To je pomembno, ker premakne pogovor od "kateri okvir naj izberemo?" na "ali sploh potrebujemo okvir?" Pri majhnih do srednje velikih projektih – ciljna stran z dinamičnimi razdelki, notranja nadzorna plošča, portal za stranke – je odgovor vedno pogostejši: morda ne ali pa vsaj ne težak. Ogrodje s 1000 vrsticami je dokaz, da je platforma dozorela do te mere, da se delo ogrodja krči.

Seveda si ogrodja, kot sta React in Vue, še vedno zaslužijo svojo težo v obsežnih aplikacijah s kompleksnimi drevesi stanj, potrebami upodabljanja na strani strežnika in skupinami več kot 20 razvijalcev, ki imajo koristi od strogih konvencij. Ključni vpogled je, da je pravo orodje v celoti odvisno od obsega težave.

Prava cena napihnjenosti JavaScript

Googlova lastna raziskava dosledno kaže, da lahko vsakih 100 milisekund dodanega časa nalaganja zniža stopnjo konverzije za do 7 %. Povprečna spletna stran zdaj pošilja več kot 500 KB JavaScripta – številka, ki se je od leta 2015 skoraj potrojila. Za podjetja to ni abstraktna metrika uspešnosti. To neposredno pomeni izgubo prihodka, višje stopnje obiskov ene strani in slabše uvrstitve v iskalnikih.

Težava se poveča v mobilnih omrežjih. Uporabnik naprave Android srednjega razreda, ki se povezuje prek 3G, lahko počaka 5–8 sekund, da postane stran, ki je obremenjena z JavaScriptom, interaktivna, tudi potem, ko je začetni HTML že upodobljen. To je še posebej hudo za podjetja, ki nudijo storitve strankam na nastajajočih trgih, kjer je brskanje s prednostjo mobilnih naprav pravilo in se omrežna infrastruktura zelo razlikuje.

• Čas razčlenjevanja: Razčlenjevanje in prevajanje velikih svežnjev JavaScript traja dlje, še preden se izvede ena vrstica kode aplikacije
• Pritisk na pomnilnik: Zapleteni notranji deli ogrodja porabljajo pomnilnik, ki bi ga lahko uporabila sama aplikacija
• Utrujenost posodabljanja: Večje nadgradnje ogrodja (Angular 1 do 2, Vue 2 do 3, komponente razreda React do kavljev) zahtevajo drago selitev vsake 2-3 leta
• Verige odvisnosti: Tipična mapa node_modules projekta React vsebuje 800–1200 paketov, od katerih je vsak potencialna varnostna ranljivost ali zlomljiva sprememba
• Zapletenost gradnje: Webpack, Babel, PostCSS in njihove konfiguracijske datoteke pogosto presegajo kodo aplikacije, ki jo strežejo

Mikro ogrodja se izognejo večini teh stroškov. Z manj abstrakcijami je manj stvari, ki jih je treba pokvariti, manj odvisnosti za revizijo in manj bajtov za pošiljanje v brskalnik. Za podjetje, ki potrebuje hitro in zanesljivo prisotnost v spletu brez namenske ekipe za čelno infrastrukturo, je matematika vse bolj naklonjena preprostosti.

Zakaj je skupnost razvijalcev razdeljena

Razprava Hacker News o majhnih ogrodjih SPA zanesljivo ustvari dva nasprotujoča si tabora. Na eni strani so razvijalci, ki so leta preživeli v velikih kodnih bazah, zgrajenih na React ali Angular, in so iz prve roke videli, kako se kompleksnost ogrodja sčasoma poveča. Opazovali so, kako se preproste funkcije razraščajo v večdnevne naloge, ker konvencije ogrodja zahtevajo dotikanje konfiguracije usmerjevalnika, predlogo za upravljanje stanja in preskusne pasove, ki se norčujejo iz notranjosti ogrodja. Za te razvijalce okvir s 1000 vrsticami predstavlja osvoboditev – vrnitev k razumevanju vsake vrstice kode, ki se izvaja v njihovi aplikaciji.

Na drugi strani so pragmatiki, ki poudarjajo, da okviri obstajajo, ker aplikacije v resničnem svetu sčasoma potrebujejo tisto, kar ponujajo: pripomočke za dostopnost, internacionalizacijo, razdelitev kode, upodabljanje na strani strežnika in nabor razvijalcev, ki že poznajo orodje. Mikro ogrodje bi lahko bilo čudovito za projekt ob koncu tedna, trdijo, vendar poskusite vkrcati ekipo petih članov na prilagojeno kodno zbirko s 1000 vrsticami brez odgovorov Stack Overflow in brez uradne dokumentacije.

Obe strani imata veljavne točke in resnica je, da je izbira kontekstualna. Samostojni ustanovitelj, ki gradi MVP, ima bistveno drugačne potrebe kot podjetniška ekipa, ki vzdržuje pet let staro aplikacijo. Nevarnost je v uporabi rešitev za podjetja za težave pri zagonu ali orodij za zagon za izzive podjetij.

Kaj sodobna podjetja dejansko potrebujejo od svojih tehnoloških skladov

Okvirna razprava je navsezadnje približek za širše vprašanje: kako naj podjetja razporedijo svoje omejene tehnične vire? Vsaka ura, ki jo razvijalec porabi za konfiguriranje cevovoda gradnje ali selitev na novo različico ogrodja, je ura, ki jo porabi za gradnjo funkcij, ki služijo strankam. Za številna podjetja – zlasti mala in srednje velika podjetja – je idealna tehnološka izbira tista, ki zmanjša vrzel med »imam idejo« in »stranke jo uporabljajo«.

Najboljša tehnološka odločitev, ki jo lahko sprejme rastoče podjetje, je izbira orodij, ki rešujejo današnje težave brez ustvarjanja jutrišnjega bremena vzdrževanja. Ne glede na to, ali to pomeni ogrodje s 1000 vrsticami ali popolnoma upravljano platformo, je cilj enak: porabite svoj čas za tisto, zaradi česar je vaše podjetje edinstveno, ne za infrastrukturo, ki jo potrebuje vsako podjetje.

To načelo presega okvire čelnega vmesnika. Podjetja redno obnavljajo iste zaledne sisteme – preverjanje pristnosti uporabnikov, obdelavo plačil, CRM, izdajanje računov, razporejanje – ker to zahteva njihov izbrani tehnološki sklop. Platforme, kot je Mewayz, obstajajo ravno zato, da odpravijo to ponavljajoče se delo, saj ponujajo 207 vnaprej zgrajenih modulov, ki pokrivajo vse od CRM in obračuna plač do sistemov rezervacij in analitike. Ista filozofija, ki vodi razvijalce k mikro ogrodjem – naredite več z manj, odpravite nepotrebno kompleksnost – žene podjetja k konsolidiranim platformam, ki nadomestijo na desetine naročnin SaaS z enim samim sistemom.

The Framework Spectrum: Finding Your Sweet Spot

Namesto da izbiro ogrodja obravnavamo kot binarno – mega-ogrodje ali mikro-ogrodje – pomaga razmišljati v smislu spektra. Na enem koncu imate vaniljev JavaScript z ničelnimi abstrakcijami. Po drugi strani pa imate meta-ogrodja s polnim skladom, kot sta Next.js ali Nuxt, ki skrbijo za usmerjanje, upodabljanje, pridobivanje podatkov in uvajanje. Večina projektov sodi nekje v sredino.

Za spletno mesto za trženje, ki je usmerjeno k strankam, z nekaj interaktivnimi elementi je lahko mikro-ogrodje ali celo vgrajena reaktivnost v slogu Alpine.js popolno prileganje. Za kompleksno nadzorno ploščo SaaS s podatki v realnem času, dovoljenji na podlagi vlog in podporo brez povezave je zrelo ogrodje z bogatim ekosistemom vredno dodatnih stroškov. Napaka je privzeta najtežja možnost, ker je najbolj priljubljena, ali privzeta najlažja, ker je intelektualno najbolj zadovoljiva.

Praktični preizkus je preprost: navedite vse funkcije, ki jih vaša aplikacija potrebuje v naslednjih 12 mesecih. Če mikroogrodje pokriva 90 % teh potreb in lahko preostalih 10 % zvijete ročno v krajšem času, kot bi ga porabili za konfiguriranje večjega ogrodja, zmaga mikro ogrodje. Če vaš seznam funkcij vključuje upodabljanje na strežniški strani, kompleksno preverjanje obrazcev, orkestracijo animacije in podporo za globoko dostopnost, se bo večje ogrodje verjetno poplačalo.

Lekcije za netehnične ustanovitelje in poslovneže

Če vodite podjetje in vaša tehnična ekipa razpravlja o okvirih, je tukaj tisto, kar je dejansko pomembno. Najprej se vprašajte o času do prve funkcije – kako hitro lahko novi razvijalec v ekipi pošlje pomembno spremembo? Če odgovor vključuje dneve nastavitve okolja in učenja okvira, je to opozorilni znak, ne glede na to, kateri okvir je bil izbran. Drugič, vprašajte o poti nadgradnje. Ogrodja, ki vsakih 18 mesecev izdajo najnovejše spremembe, nalagajo skriti davek, ki se redko pojavi v začetni oceni.

Tretjič in najpomembnejše, vprašanje, ali za zadevno funkcijo sploh potrebujete prilagojeno programsko opremo. Številna podjetja vložijo mesece razvijalskega časa v izgradnjo notranjih orodij – nadzorne plošče, sistemi CRM, tokovi izdajanja računov, vmesniki za razporejanje – ki že obstajajo kot uglajeni, vzdrževani izdelki. Platforma, kot je Mewayz, ki služi več kot 138.000 uporabnikom z moduli, ki obsegajo celoten spekter poslovnih operacij, lahko v celoti odpravi potrebo po razvoju po meri za standardne poslovne funkcije. To vaši razvojni ekipi omogoča, da se osredotoči na resnično edinstvene vidike vašega izdelka – funkcije, ki jih ne more zagotoviti nobeno standardno orodje.

1. Preverite kodo po meri: Ugotovite, katera notranja orodja podvajajo funkcionalnost, ki je na voljo v obstoječih platformah
2. Izračunajte dejanske stroške: Upoštevajte ne samo začetni razvoj, temveč tudi stalno vzdrževanje, varnostne popravke in zahteve po funkcijah
3. Ocenite konsolidacijo: Preštejte svoje trenutne naročnine na SaaS in primerjajte stroške z integrirano platformo
4. Zaščitite svoje razlikovalce: Rezervirajte razvojne vire po meri za funkcije, ki vaše podjetje resnično ločijo od drugih

Prihodnost pripada namernim odločitvam

Navdušenje okoli 1000-vrstičnega ogrodja SPA pravzaprav ni povezano z ogrodjem samim. Gre za naraščajoče gibanje v razvoju programske opreme v smeri namernosti – izbiranje orodij, ker ustrezajo problemu, ne zato, ker prevladujejo na trgu. Ekosistem JavaScript je zadnje desetletje preživel v oboroževalni tekmi funkcij in abstrakcij. Protigibanje, ki ga predstavljajo mikro-ogrodja, strežniško upodobljen HTML in API-ji, ki izvirajo iz platforme, je popravek v smeri pragmatizma.

Za podjetja je ta premik nedvoumno pozitiven. Pomeni več možnosti, nižje stroške zamenjave in kulturo razvijalcev, ki vedno bolj ceni preprostost in hitrost pred teoretično popolnostjo. Ne glede na to, ali ste samostojni podjetnik, ki izbira med WordPressom in po meri izdelanim spletnim mestom, ali tehnični direktor, ki ocenjuje, ali bi zgradil ali kupil svoje naslednje interno orodje, velja isto načelo: najboljša tehnologija je tista, ki izgine v ozadje in vam omogoča, da se osredotočite na služenje strankam.

Ogrodje s 1000 vrsticami nas opominja, da moč ne zahteva zapletenosti. Najučinkovitejša podjetja – in najučinkovitejša orodja – so tista, ki naredijo točno to, kar je potrebno, in nič več.

Pogosto zastavljena vprašanja

Kaj je mikroogrodje, kot je Vertex.js?

Mikro ogrodje je minimalistična knjižnica JavaScript, zasnovana za opravljanje osnovnih aplikacijskih nalog brez množice večjih rešitev. Vertex.js to doseže z zagotavljanjem bistvenih funkcij SPA, kot sta usmerjanje in upravljanje stanja, v približno 1000 vrsticah kode. To je v nasprotju z okviri, ki zahtevajo ločene, težje knjižnice za usmerjanje ali stanje, kar zmanjšuje splošno zapletenost in napihnjenost manjših projektov.

Zakaj se razvijalci usmerjajo k preprostejšim orodjem?

Mnogi razvijalci menijo, da je sodobno orodje JavaScript postalo preveč zapleteno za povprečen projekt. Težka ogrodja lahko povzročijo počasen čas gradnje, strmo krivuljo učenja in nepotrebne funkcije. Enostavnejša orodja, kot je Vertex.js, ponujajo hitrejšo in bolj razumljivo razvojno izkušnjo, saj se osredotočajo na bistvene težave, ki jih mora rešiti ogrodje, in se bolje prilagajajo dejanskim zahtevam projekta.

Ali je Vertex.js primeren za velike, kompleksne aplikacije?

Vertex.js je zasnovan predvsem za manjše projekte, kjer sta preprostost in nizki stroški ključni. Za zelo velike, zapletene aplikacije s številnimi interaktivnimi komponentami bi bilo morda primernejše ogrodje z več funkcijami in obsežnim ekosistemom. Za ekipe, ki potrebujejo obsežne vnaprej zgrajene module, bi lahko storitev, kot je Mewayz (ponuja 207 modulov za 19 USD/mesec), zagotovila potreben uporabniški vmesnik in funkcionalne komponente, ki jih mikro ogrodje nima.

Ali še vedno potrebujem orodje za gradnjo z Vertex.js?

Čeprav je Vertex.js sam po sebi lahek, boste verjetno še vedno uporabljali orodje za gradnjo za profesionalni razvoj. Orodja, kot sta Vite ali Parcel, so potrebna za združevanje vaše kode, obravnavanje odvisnosti npm in omogočanje sodobnih funkcij JavaScript. Vendar splošna veriga orodij ostaja enostavnejša od tistih, ki jih zahtevajo večja ogrodja, saj se izognete zapletenemu upravljanju stanja in usmerjevalnim knjižnicam.