Rādīt HN: Vertex.js – A 1kloc SPA Framework

Mikroietvaru pieaugums: kāpēc izstrādātāji noraida pārslogotus JavaScript rīkus

Kāds izstrādātājs nesen Hacker News ievietoja vienas lapas lietojumprogrammu ietvaru, kurā ir aptuveni 1000 koda rindiņu, un atbilde bija elektriska. Projekts — minimālistisks SPA ietvars — atkal izraisīja debates, kas tīmekļa izstrādes kopienā virmo jau gadiem ilgi: vai mūsu rīki ir kļuvuši pārāk sarežģīti problēmu risināšanai? Kad React galvenā bibliotēka, tā maršrutētājs, stāvokļa pārvaldības slānis un tā izveides rīki kopā sver simtiem tūkstošu koda rindu, sistēma, kas nodrošina maršrutēšanu, reaktivitāti un komponentu renderēšanu tikai 1000 rindiņās, liek uzdot neērtu jautājumu. Uzņēmumiem, kas veido klientiem paredzētas lietojumprogrammas, atbildei uz šo jautājumu ir reālas sekas — ielādes laiks, izstrādātāja produktivitāte un ilgtermiņa uzturēšanas izmaksas.

Ko patiesībā pierāda 1000 rindu ietvars

Mikroietvara ideja nav jauna. Kad tas tika debitēts 2010. gadā, Backbone.js bija aptuveni 1800 rindiņu anotēta avota koda. Mithril.js tiek piegādāts mazāk nekā 10 KB gzip formātā. Katru jaunu ierakstu šajā kategorijā ievērības cienīgu padara nevis pats rindu skaits, bet gan tas, ko tas atklāj par pārlūkprogrammas API pašreizējo stāvokli. Mūsdienu pārlūkprogrammas nodrošina vietējo veidņu literāļu atbalstu, vēstures API, starpniekservera reaktivitāti, pielāgotus elementus un moduļu ielādi. Pirms desmit gadiem ietvariem bija vajadzīgas tūkstošiem līniju, lai normalizētu atšķirības starp Internet Explorer un Chrome. Mūsdienās prasmīgs izstrādātājs var izveidot pilnībā funkcionālu SPA ietvaru kā plānu orķestrācijas slāni virs platformas primitīviem.

Tam ir nozīme, jo tas novirza sarunu no "kuru sistēmu mums izvēlēties?" uz "vai mums vispār ir vajadzīgs ietvars?" Maziem un vidējiem projektiem — galvenajai lapai ar dinamiskām sadaļām, iekšējam informācijas panelim, klientu portālam — atbilde arvien biežāk ir: varbūt nē, vai vismaz ne smagnēja. 1000 rindu ietvars ir pierādījums tam, ka platforma ir nobriedusi līdz tādam līmenim, ka ietvara darbs samazinās.

Protams, tādas sistēmas kā React un Vue joprojām nopelna savu nozīmi lielapjoma lietojumprogrammās ar sarežģītiem stāvokļa kokiem, servera puses renderēšanas vajadzībām un vairāk nekā 20 izstrādātāju komandām, kas gūst labumu no stingriem noteikumiem. Galvenais ieskats ir tāds, ka pareizais rīks ir pilnībā atkarīgs no problēmas apjoma.

JavaScript uzpūšanās reālās izmaksas

Paša Google pētījumi ir konsekventi parādījuši, ka ik pēc 100 milisekundēm pievienotā ielādes laika var samazināt reklāmguvumu līmeni līdz pat 7%. Vidējā tīmekļa lapa tagad nodrošina vairāk nekā 500 KB JavaScript — šis rādītājs kopš 2015. gada ir gandrīz trīskāršojies. Uzņēmumiem tas nav abstrakts veiktspējas rādītājs. Tas tieši izpaužas kā zaudēti ieņēmumi, augstāks atlēcienu līmenis un sliktāks vērtējums meklētājprogrammās.

Problēma ir sarežģītāka mobilajos tīklos. Lietotājs vidējas klases Android ierīcē, kas savieno, izmantojot 3G, var gaidīt 5–8 sekundes, līdz lapa, kurā ir daudz JavaScript, kļūs interaktīva, pat pēc sākotnējā HTML atveidošanas. Tas ir īpaši sodāmi uzņēmumiem, kas apkalpo klientus jaunajos tirgos, kur mobilo ierīču pārlūkošana ir ierasta lieta un tīkla infrastruktūra krasi atšķiras.

• Parsēšanas laiks: lielu JavaScript komplektu parsēšana un kompilēšana prasa ilgāku laiku, pat pirms tiek izpildīta viena lietojumprogrammas koda rinda.
• Atmiņas spiediens: sarežģītas sistēmas iekšējie elementi patērē atmiņu, ko var izmantot pati lietojumprogramma.
• Atjaunināšanas nogurums: nozīmīgi sistēmas jauninājumi (Angular 1–2, Vue 2–3, React klases komponenti uz āķiem) liek veikt dārgus migrācijas pasākumus ik pēc 2–3 gadiem.
• Atkarības ķēdes: tipiskā React projekta mapē node_modules ir 800–1200 pakotņu, un katra no tām ir iespējama drošības ievainojamība vai bojātas izmaiņas.
• Sarežģītība: Webpack, Babel, PostCSS un to konfigurācijas faili bieži pārsniedz lietojumprogrammas kodu, ko tie apkalpo.

Mikroietvari apņem lielāko daļu šo izmaksu. Ar mazāku abstrakciju skaitu ir mazāk pārraujamu lietu, mazāk pārbaudāmo atkarību un mazāk baitu, kas jānosūta pārlūkprogrammai. Uzņēmumam, kuram nepieciešama ātra, uzticama klātbūtne tīmeklī bez īpašas priekšgala infrastruktūras komandas, matemātika arvien vairāk dod priekšroku vienkāršībai.

Kāpēc izstrādātāju kopiena ir sadalīta

Hacker News diskusija par nelieliem SPA ietvariem droši ģenerē divas pretējas nometnes. No vienas puses ir izstrādātāji, kuri ir pavadījuši gadus lielās kodu bāzēs, kuru pamatā ir React vai Angular, un ir klātienē redzējuši, kā ietvara sarežģītība laika gaitā saplūst. Viņi ir noskatījušies, ka vienkāršas funkcijas tiek iekļautas vairāku dienu uzdevumos, jo ietvara konvencijām ir nepieciešams pieskarties maršrutētāja konfigurācijai, stāvokļa pārvaldības veidlapai un testēšanas instalācijām, kas izsmej ietvara iekšējās funkcijas. Šiem izstrādātājiem 1000 rindu sistēma nozīmē atbrīvošanu — atgriešanos pie izpratnes par katru koda rindiņu, kas darbojas viņu lietojumprogrammā.

No otras puses, ir pragmatiķi, kuri norāda, ka ietvari pastāv, jo reālās pasaules lietojumprogrammām galu galā ir vajadzīgs tas, ko tās nodrošina: pieejamības utilītas, internacionalizācija, koda sadalīšana, servera puses renderēšana un izstrādātāju pieņemšana darbā, kuri jau zina šo rīku. Viņi apgalvo, ka mikroietvars varētu būt apburošs nedēļas nogales projektam, taču mēģiniet izveidot piecu cilvēku komandu īpaši pielāgotā 1000 rindu koda bāzē bez Stack Overflow atbildēm un bez oficiālas dokumentācijas.

Abām pusēm ir derīgi punkti, un patiesība ir tāda, ka izvēle ir atkarīga no konteksta. Vienam dibinātājam, kurš veido MVP, ir būtiski atšķirīgas vajadzības nekā uzņēmuma komandai, kas uztur piecus gadus vecu lietojumprogrammu. Briesmas ir saistītas ar uzņēmuma risinājumu izmantošanu starta problēmām vai startēšanas rīku izmantošanu uzņēmuma izaicinājumiem.

Kas mūsdienu uzņēmumiem patiesībā ir vajadzīgs no viņu tehnoloģiju kopas

Ietvara debates galu galā ir aizstājējs plašākam jautājumam: kā uzņēmumiem vajadzētu sadalīt savus ierobežotos tehniskos resursus? Katra stunda, ko izstrādātājs pavada, konfigurējot būvēšanas konveijera vai migrējot uz jaunu ietvara versiju, ir stunda, kas nav pavadīta, veidojot līdzekļus, kas apkalpo klientus. Daudziem uzņēmumiem — īpaši maziem un vidējiem uzņēmumiem — ideāla tehnoloģiju izvēle ir tāda, kas samazina atšķirību starp “man ir ideja” un “klienti to izmanto”.

Labākais lēmums par tehnoloģiju, ko augošs uzņēmums var pieņemt, ir tādu rīku izvēle, kas atrisina mūsdienu problēmas, neradot rītdienas uzturēšanas slogu. Neatkarīgi no tā, vai tas nozīmē 1000 rindu sistēmu vai pilnībā pārvaldītu platformu, mērķis ir viens: veltiet laiku tam, kas padara jūsu uzņēmumu unikālu, nevis infrastruktūru, kas nepieciešama katram uzņēmumam.

Šis princips attiecas ne tikai uz priekšgala ietvariem. Uzņēmumi regulāri pārbūvē vienas un tās pašas aizmugursistēmas — lietotāju autentifikāciju, maksājumu apstrādi, CRM, rēķinu izrakstīšanu, plānošanu —, jo to pieprasa viņu izvēlētā tehnoloģiju kopa. Tādas platformas kā Mewayz pastāv tieši, lai novērstu šo atkārtoto darbu, piedāvājot 207 iepriekš iebūvētus moduļus, kas aptver visu, sākot no CRM un algu rēķina līdz rezervēšanas sistēmām un analītikai. Tā pati filozofija, kas virza izstrādātājus uz mikroietvariem — paveiciet vairāk ar mazāk, izvairieties no nevajadzīgas sarežģītības — virza uzņēmumus uz konsolidētām platformām, kas aizvieto desmitiem SaaS abonementu ar vienu sistēmu.

Pamatprogrammas spektrs: savas jaukās vietas atrašana

Tā vietā, lai ietvara izvēli uzskatītu par bināru — megaietvaru vai mikroietvaru, tas palīdz domāt par spektru. Vienā galā jums ir vaniļas JavaScript ar nulli abstrakcijām. No otras puses, jums ir pilnas kaudzes meta ietvari, piemēram, Next.js vai Nuxt, kas apstrādā maršrutēšanu, renderēšanu, datu iegūšanu un izvietošanu. Lielākā daļa projektu ir kaut kur pa vidu.

Klientiem orientētai mārketinga vietnei ar dažiem interaktīviem elementiem mikroietvars vai pat Alpine.js stila iekļautā reaktivitāte var būt ideāli piemērota. Sarežģītam SaaS informācijas panelim ar reāllaika datiem, uz lomu balstītām atļaujām un bezsaistes atbalstu nobriedis ietvars ar bagātīgu ekosistēmu ir tā vērts. Kļūda ir tā, ka pēc noklusējuma tiek izvēlēta smagākā opcija, jo tā ir vispopulārākā, vai vieglākā opcija pēc noklusējuma, jo tā ir intelektuāli visapmierinošākā.

Praktiskā pārbaude ir vienkārša: uzskaitiet visas funkcijas, kas jūsu lietojumprogrammai nepieciešamas nākamo 12 mēnešu laikā. Ja mikroietvars apmierina 90% no šīm vajadzībām un atlikušos 10% varat veikt manuāli īsākā laikā, nekā jūs pavadītu, konfigurējot lielāku ietvaru, mikroietvars uzvar. Ja jūsu funkciju sarakstā ir iekļauta servera puses renderēšana, sarežģītu formu validācija, animācijas orķestrēšana un padziļināts pieejamības atbalsts, iespējams, lielāka sistēma atmaksājas.

Nodarbības netehniskiem dibinātājiem un uzņēmējiem

Ja vadāt uzņēmumu un jūsu tehniskā komanda apspriež ietvarus, šeit ir norādīts, kas patiesībā ir svarīgs. Pirmkārt, jautājiet par laiku līdz pirmajai funkcijai — cik ātri jauns komandas izstrādātājs var veikt nozīmīgas izmaiņas? Ja atbilde ir saistīta ar vides iestatīšanas un ietvara apguves dienām, tā ir brīdinājuma zīme neatkarīgi no izvēlētā ietvara. Otrkārt, jautājiet par jaunināšanas ceļu. Ietvaros, kas izlaiž būtiskas izmaiņas ik pēc 18 mēnešiem, tiek uzlikts slēpts nodoklis, kas reti parādās sākotnējā novērtējumā.

Treškārt, un pats galvenais, apšaubiet, vai konkrētajai funkcijai vispār ir nepieciešama īpaši izveidota programmatūra. Daudzi uzņēmumi iegulda vairākus mēnešus ilgu izstrādātāju laiku, veidojot iekšējos rīkus — informācijas paneļus, CRM sistēmas, rēķinu plūsmas, plānošanas saskarnes —, kas jau pastāv kā slīpēti, uzturēti produkti. Tāda platforma kā Mewayz, kas apkalpo vairāk nekā 138 000 lietotāju ar moduļiem, kas aptver visu biznesa operāciju spektru, var pilnībā novērst vajadzību pēc pielāgotas izstrādes standarta biznesa funkcijām. Tādējādi jūsu izstrādes komanda var koncentrēties uz patiesi unikālajiem jūsu produkta aspektiem — tām funkcijām, kuras nevar nodrošināt neviens gatavs rīks.

1. Pārbaudiet savu pielāgoto kodu: nosakiet, kuri iekšējie rīki dublē esošās platformās pieejamo funkcionalitāti.
2. Aprēķiniet patiesās izmaksas: ņemiet vērā ne tikai sākotnējo izstrādi, bet arī pastāvīgo apkopi, drošības ielāpus un funkciju pieprasījumus.
3. Novērtējiet konsolidāciju: uzskaitiet savus pašreizējos SaaS abonementus un salīdziniet izmaksas ar integrētu platformu.
4. Aizsargājiet savus atšķirības: rezervējiet pielāgotus izstrādes resursus funkcijām, kas patiesi izceļ jūsu uzņēmumu.

Nākotne ir atkarīga no apzinātām izvēlēm

Aizraušanās par 1000 rindu SPA ietvaru patiesībā nav saistīta ar pašu sistēmu. Runa ir par pieaugošu virzību programmatūras izstrādē uz nodomu — rīku izvēli tāpēc, ka tie atbilst problēmai, nevis tāpēc, ka tie dominē tirgū. JavaScript ekosistēma pēdējo desmit gadu laikā ir pavadījusi iezīmju un abstrakciju bruņošanās sacensībā. Pretdarbība, ko pārstāv mikroietvari, servera atveidots HTML un platformas vietējās API, ir labojums pragmatisma virzienā.

Uzņēmumiem šī maiņa ir nepārprotami pozitīva. Tas nozīmē vairāk iespēju, zemākas pārslēgšanas izmaksas un izstrādātāju kultūru, kas arvien vairāk vērtē vienkāršību un ātrumu, nevis teorētisko pilnīgumu. Neatkarīgi no tā, vai esat individuāls uzņēmējs, kas izvēlas starp WordPress un īpaši izveidotu vietni, vai CTO, kas izvērtē, vai izveidot vai iegādāties nākamo iekšējo rīku, tiek piemērots tas pats princips: labākā tehnoloģija ir tā, kas pazūd fonā, ļaujot jums koncentrēties uz klientu apkalpošanu.

1000 rindu sistēma mums atgādina, ka jaudai nav nepieciešama sarežģītība. Visefektīvākie uzņēmumi un visefektīvākie rīki ir tie, kas dara tieši to, kas nepieciešams, un neko vairāk.

Bieži uzdotie jautājumi

Kas ir tāds mikroietvars kā Vertex.js?

Mikroietvars ir minimālisma JavaScript bibliotēka, kas izstrādāta, lai veiktu lietojumprogrammu pamatuzdevumus bez lielākās daļas lielāku risinājumu. Vertex.js to panāk, nodrošinot būtisku SPA funkcionalitāti, piemēram, maršrutēšanu un stāvokļa pārvaldību, aptuveni 1000 koda rindiņās. Tas ir pretstatā ietvariem, kuru maršrutēšanai vai stāvoklim ir nepieciešamas atsevišķas, smagākas bibliotēkas, tādējādi samazinot kopējo sarežģītību un uzpūšanos mazākiem projektiem.

Kāpēc izstrādātāji pāriet uz vienkāršākiem rīkiem?

Daudzi izstrādātāji uzskata, ka mūsdienu JavaScript rīki ir kļuvuši pārāk sarežģīti vidējam projektam. Smagas sistēmas var ieviest lēnu izveides laiku, strauju mācīšanās līkni un nevajadzīgas funkcijas. Vienkāršāki rīki, piemēram, Vertex.js, piedāvā ātrāku un saprotamāku izstrādes pieredzi, koncentrējoties uz būtiskām problēmām, kas ietvaram jāatrisina, labāk pielāgojoties projekta faktiskajām prasībām.

Vai Vertex.js ir piemērots lielai, sarežģītai lietojumprogrammai?

Vertex.js galvenokārt ir paredzēts mazākiem projektiem, kur galvenais ir vienkāršība un zemas pieskaitāmās izmaksas. Ļoti lielām, sarežģītām lietojumprogrammām ar daudziem interaktīviem komponentiem piemērotāks varētu būt ar funkcijām bagātāks ietvars ar plašu ekosistēmu. Komandām, kurām nepieciešami plaši iepriekš izveidoti moduļi, tāds pakalpojums kā Mewayz (piedāvā 207 moduļus par 19 ASV dolāriem mēnesī) varētu nodrošināt nepieciešamo lietotāja interfeisu un funkcionālos komponentus, kuru trūkst mikroietvarā.

Vai man joprojām ir nepieciešams veidošanas rīks ar Vertex.js?

Lai gan Vertex.js pats par sevi ir viegls, jūs, iespējams, joprojām izmantosit veidošanas rīku profesionālajai attīstībai. Tādi rīki kā Vite vai Parcel ir nepieciešami, lai grupētu jūsu kodu, apstrādātu npm atkarības un iespējotu mūsdienīgas JavaScript funkcijas. Tomēr kopējā rīku ķēde joprojām ir vienkāršāka nekā tiem, kas nepieciešami lielākiem ietvariem, jo ​​jūs izvairīsities no sarežģītas stāvokļa pārvaldības un maršrutēšanas bibliotēkām.