HN харуулах: Vertex.js – 1kloc SPA Framework

Бичил фрэймворкуудын өсөлт: Яагаад хөгжүүлэгчид JavaScript-ийн бүдүүлэг хэрэглүүрээс татгалзаж байна вэ

Хөгжүүлэгч саяхан Hacker News-д ойролцоогоор 1000 мөр кодоор бүтээгдсэн нэг хуудас програмын хүрээг нийтэлсэн бөгөөд хариу нь цахилгаанаар хийгдсэн. Энэхүү төсөл нь минималист SPA хүрээ бөгөөд вэб хөгжүүлэлтийн нийгэмлэгт олон жилийн турш шуугиан дэгдээж байсан мэтгэлцээнийг дахин эхлүүлсэн: бидний хэрэглүүр шийддэг асуудлуудад хэтэрхий төвөгтэй болсон уу? React-ийн үндсэн номын сан, түүний чиглүүлэгч, төлөвийн удирдлагын давхарга, бүтээх хэрэгслүүд нь нийлээд хэдэн зуун мянган мөр кодын жинтэй байх үед чиглүүлэлт, реактив байдал, бүрэлдэхүүн хэсгүүдийг ердөө 1000 мөрөнд буулгадаг хүрээ нь эвгүй асуултыг төрүүлдэг. Хэрэглэгчдэд зориулсан програмуудыг бүтээдэг бизнесүүдийн хувьд энэ асуултын хариулт нь ачаалах хугацаа, хөгжүүлэгчийн бүтээмж, урт хугацааны засвар үйлчилгээний зардал зэрэг бодит үр дагавартай.

1000 мөрийн хүрээ юуг баталдаг вэ

Бичил хүрээний санаа нь шинэ зүйл биш юм. Backbone.js нь 2010 онд нээлтээ хийхдээ ойролцоогоор 1800 мөр тайлбартай эх кодтой байсан. Mithril.js нь 10КБ-аас бага хэмжээтэй gzip файлтай. Энэ категорийн шинэ оруулга бүрийг анхаарал татахуйц зүйл бол мөрийн тоо биш харин хөтчийн API-ийн одоогийн төлөв байдлын талаар илчлэх зүйл юм. Орчин үеийн хөтчүүд загвар литерал, History API, проксид суурилсан реактив байдал, өөрчлөн тохируулсан элементүүд болон модулийг ачаалах үндсэн дэмжлэгтэйгээр нийлүүлдэг. Арван жилийн өмнө Internet Explorer болон Chrome хоёрын ялгааг хэвийн болгохын тулд фреймворкуудад хэдэн мянган мөр хэрэгтэй байсан. Өнөөдөр чадварлаг хөгжүүлэгч бүрэн ажиллагаатай SPA хүрээг платформын үндсэн дээр нимгэн зохион байгуулалтын давхарга болгон бүтээж чадна.

Энэ нь харилцан яриаг "бид аль хүрээг сонгох ёстой вэ?"-ээс өөрчилдөг учраас чухал юм. "Бидэнд ерөнхийдөө хүрээ хэрэгтэй юу?" Жижиг-дунд төслүүдийн хувьд - динамик хэсгүүдтэй буух хуудас, дотоод хяналтын самбар, хэрэглэгчийн портал - хариулт нь улам бүр нэмэгдэж байна: магадгүй үгүй, эсвэл ядаж хүнд биш. 1000 мөрийн хүрээ нь платформ нь хүрээний ажил багасах хэмжээнд хүртэл төлөвшсөний нотолгоо юм.

Мэдээжийн хэрэг, React болон Vue гэх мэт фреймворкууд нь нарийн төвөгтэй төлөвийн мод, сервер талын үзүүлэх хэрэгцээ, хатуу конвенцийн үр шимийг хүртдэг 20+ хөгжүүлэгчдийн баг бүхий том хэмжээний программуудад жингээ нэмсээр байна. Гол ойлголт бол зөв хэрэгсэл нь асуудлын цар хүрээнээс бүрэн хамаарна.

JavaScript Bloat-ийн бодит өртөг

Google-ийн өөрийн судалгаагаар 100 миллисекунд ачаалах хугацаа тутамд хөрвүүлэх хурдыг 7% хүртэл бууруулж чадна гэдгийг тогтмол харуулсан. Медиан вэб хуудас одоо 500КБ-аас дээш JavaScript-г илгээж байна. Энэ нь 2015 оноос хойш бараг гурав дахин өссөн үзүүлэлт юм. Бизнесийн хувьд энэ нь хийсвэр гүйцэтгэлийн хэмжүүр биш юм. Энэ нь орлого алдагдах, буцах ханш өндөр, хайлтын системийн зэрэглэл мууддаг.

Мобайл сүлжээнд асуудал улам бүр нэмэгдсээр байна. 3G-ээр холбогдож буй дунд түвшний Андройд төхөөрөмж дээрх хэрэглэгч эхний HTML-г боловсруулсны дараа ч JavaScript-н ачаалал ихтэй хуудас интерактив болох хүртэл 5-8 секунд хүлээх боломжтой. Энэ нь ялангуяа мобайл хэрэглээг түрүүлж үзэх нь жишиг бөгөөд сүлжээний дэд бүтэц нь эрс ялгаатай хөгжиж буй зах зээлд хэрэглэгчдэд үйлчилдэг бизнес эрхлэгчдийг шийтгэдэг.

• Prese time: Том хэмжээний JavaScript багцуудыг нэг мөр програмын код ажиллахаас өмнө задлан шинжилж, эмхэтгэхэд илүү их хугацаа шаардагдана
• Санах ойн дарамт: Нарийн төвөгтэй фреймворкийн дотоод системүүд нь програм өөрөө ашиглаж болох санах ойг хэрэглэдэг
• Шинэчлэх ядаргаа: Үндсэн суурь шинэчлэлтүүд (Өнцөг 1-ээс 2-оос, Vue 2-оос 3-аас, Ангины бүрэлдэхүүн хэсгүүдэд дэгээгээр хариу үйлдэл үзүүлэх) 2-3 жил тутамд өндөр өртөгтэй шилжих хүчин чармайлтыг шаарддаг
• Хамааралтай гинж: Ердийн React төслийн node_modules хавтас нь 800-1200 багцыг агуулж байдаг бөгөөд тус бүр нь аюулгүй байдлын эмзэг байдал эсвэл өөрчлөлтийг зөрчсөн байж болзошгүй
• Бүтээцийн нарийн төвөгтэй байдал: Webpack, Babel, PostCSS болон тэдгээрийн тохиргооны файлууд нь ихэвчлэн тэдний үйлчилдэг програмын кодоос хэтэрдэг

Бичил хүрээ нь эдгээр зардлын ихэнхийг тойрон гардаг. Цөөн хийсвэр хийснээр эвдэх зүйл цөөхөн, аудит хийх хамаарал багасч, хөтөч рүү илгээхэд бага байт болно. Зориулалтын дэд бүтцийн баггүй хурдан, найдвартай вэбтэй байх шаардлагатай бизнесийн хувьд математик энгийн байдлыг илүүд үздэг.

Яагаад Хөгжүүлэгчдийн нийгэмлэг хуваагдсан бэ

Өчүүхэн SPA хүрээг тойрсон Хакерын мэдээний хэлэлцүүлэг нь хоёр эсрэг тэсрэг лагерийг найдвартай үүсгэдэг. Нэг талд нь React эсвэл Angular дээр бүтээгдсэн томоохон кодын санд олон жил зарцуулж, хүрээний нарийн төвөгтэй байдал цаг хугацааны явцад хэрхэн нийлдэг болохыг нүдээр харсан хөгжүүлэгчид байдаг. Фреймворкийн конвенцууд нь чиглүүлэгчийн тохиргоо, төлөвийн удирдлагын самбар болон фреймворкийн дотоод хэсгийг элэглэдэг туршилтын бэхэлгээг шаарддаг тул тэд энгийн функцуудыг олон өдрийн даалгавар болгон хувиргаж байгааг харсан. Эдгээр хөгжүүлэгчдийн хувьд 1000 мөрийн хүрээ нь чөлөөлөлтийг илэрхийлдэг бөгөөд энэ нь тэдний програмд ажиллаж буй кодын мөр бүрийг ойлгоход буцах явдал юм.

Нөгөө талд бодит ертөнцийн хэрэглүүрүүд эцсийн дүндээ хүртээмжтэй болгох хэрэгслүүд, олон улсын болгох, код хуваах, серверт үзүүлэх үйлчилгээ, уг хэрэгслийг аль хэдийн мэддэг хөгжүүлэгчдийг ажилд авах зэрэг шаардлагатай байдаг тул хүрээнүүд байдаг гэдгийг онцолсон прагматикууд байдаг. Амралтын өдрүүдийн төслийн хувьд бичил хүрээ нь тааламжтай байж магадгүй гэж тэд маргаж байгаа ч Stack Overflow хариултгүй, албан ёсны баримт бичиггүйгээр 5 хүний бүрэлдэхүүнтэй 1000 мөр кодын баазыг захиалж үзээрэй.

Аль аль талдаа хүчинтэй оноо байгаа бөгөөд сонголт нь контекст хамааралтай гэдэг нь үнэн юм. MVP-ийг бий болгож буй соло үүсгэн байгуулагч нь таван жилийн хугацаатай программыг ажиллуулж буй аж ахуйн нэгжийн багаас тэс өөр хэрэгцээтэй байдаг. Аюул нь гарааны асуудалд аж ахуйн нэгжийн шийдлийг ашиглах эсвэл байгууллагын сорилтод гарааны хэрэгслийг ашиглах явдал юм.

Орчин үеийн бизнесүүдэд өөрсдийн технологийн багцаас яг юу хэрэгтэй вэ

Хүрээний мэтгэлцээн нь эцсийн дүндээ илүү том асуултыг хариуцдаг: бизнесүүд хязгаарлагдмал техникийн нөөцөө хэрхэн хуваарилах ёстой вэ? Хөгжүүлэгчийн бүтээх шугамыг тохируулах эсвэл шинэ фрэймворкийн хувилбар руу шилжихэд зарцуулсан цаг бүр хэрэглэгчдэд үйлчлэх функцуудыг бий болгоход зарцуулагдаагүй цаг юм. Олон бизнесийн, ялангуяа жижиг, дунд хэмжээний бизнесийн хувьд хамгийн тохиромжтой технологийн сонголт бол "Надад санаа байна" болон "Хэрэглэгчид үүнийг ашиглаж байна" гэсэн хоёрын хоорондох зайг багасгах явдал юм.

Өсөн нэмэгдэж буй бизнесийн хамгийн сайн технологийн шийдвэр бол маргаашийн засвар үйлчилгээний ачааллыг бий болгохгүйгээр өнөөдрийн асуудлыг шийдвэрлэх хэрэгслүүдийг сонгох явдал юм. Энэ нь 1,000 мөрийн хүрээ эсвэл бүрэн удирддаг платформ гэсэн үг үү, зорилго нь нэг юм: бизнес бүрт хэрэгтэй дэд бүтцэд бус, бизнесээ өвөрмөц болгодог зүйлд цагаа зарцуул.

Энэ зарчим нь frontend framework-ээс хэтэрдэг. Бизнесүүд хэрэглэгчийн баталгаажуулалт, төлбөрийн боловсруулалт, CRM, нэхэмжлэх, хуваарь гэх мэт ижил төрлийн арын системүүдийг байнга сэргээдэг, учир нь тэдний сонгосон технологийн стек үүнийг шаарддаг. Mewayz гэх мэт платформууд нь CRM, цалингийн жагсаалтаас эхлээд захиалгын систем, аналитик хүртэлх бүх зүйлийг хамарсан урьдчилан бүтээгдсэн 207 модулийг санал болгож, энэ давтагдах ажлыг арилгахад зориулагдсан байдаг. Хөгжүүлэгчдийг бага зардлаар ихийг хийж, шаардлагагүй нарийн төвөгтэй байдлыг арилгадаг бичил хүрээ рүү чиглүүлдэг философи нь бизнесүүдийг олон арван SaaS захиалгыг нэг системээр сольдог нэгдсэн платформууд руу чиглүүлдэг.

Хүрээний спектр: Өөрийн сайхан цэгийг олох нь

Энэ нь хүрээний сонголтыг хоёртын хувилбар буюу мега хүрээ эсвэл микро фреймворк гэж үзэхийн оронд спектрийн хувьд бодоход тусалдаг. Нэг төгсгөлд танд хийсвэрлэл байхгүй ванилийн JavaScript байна. Нөгөө талаас, танд чиглүүлэлт, рэндэрлэх, өгөгдөл татах, байршуулах зэрэгт Next.js эсвэл Nuxt зэрэг бүрэн стек мета-фрэймүүд байдаг. Ихэнх төслүүд дунд хэсэгт нь харьяалагддаг.

Цөөн хэдэн интерактив элемент бүхий хэрэглэгчдэд чиглэсэн маркетингийн сайтын хувьд бичил хүрээ эсвэл бүр Alpine.js загварын шугаман реактив нь төгс тохирох болно. Бодит цагийн өгөгдөл, дүрд суурилсан зөвшөөрөл, офлайн дэмжлэг бүхий нарийн төвөгтэй SaaS хяналтын самбарын хувьд баялаг экосистемтэй боловсорсон хүрээ нь нэмэлт зардал юм. Алдаа нь хамгийн алдартай учраас хамгийн хүнд сонголтоор сонгогдсон, эсвэл оюуны хувьд хамгийн сэтгэл ханамжтай учраас хамгийн хөнгөн сонголттой.

Практик тест нь энгийн: дараагийн 12 сарын хугацаанд таны хэрэглүүрт шаардлагатай бүх функцийг жагсаан бич. Хэрэв микро фреймворк нь эдгээр хэрэгцээний 90% -ийг хангаж, та илүү том хүрээг тохируулахад зарцуулахаас богино хугацаанд үлдсэн 10% -ийг гараар эргүүлж чадвал микро хүрээ ялах болно. Хэрэв таны онцлогуудын жагсаалтад сервер талын дүрслэл, цогц хэлбэрийн баталгаажуулалт, хөдөлгөөнт зохион байгуулалт, гүн гүнзгий хүртээмжийн дэмжлэг багтсан бол илүү том хүрээ нь өөрөө зардлаа нөхөх магадлалтай.

Техникийн бус үүсгэн байгуулагч, бизнес эрхлэгчдэд зориулсан сургамж

Хэрэв та бизнес эрхэлж байгаа бол таны техникийн баг хүрээний талаар хэлэлцэж байгаа бол энд хамгийн чухал зүйл байна. Юуны өмнө, анхны онцлогийг эхлүүлэх цаг хугацааны талаар асуу - багийн шинэ хөгжүүлэгч ямар хурдан утга учиртай өөрчлөлтийг хүргэж чадах вэ? Хэрэв хариулт нь орчны тохиргоо, хүрээг судлах олон хоногтой холбоотой бол аль хүрээг сонгосон эсэхээс үл хамааран энэ нь анхааруулах тэмдэг юм. Хоёрдугаарт, шинэчлэх замын талаар асуу. 18 сар тутамд үндсэн өөрчлөлтүүдийг гаргадаг тогтолцоо нь анхны үнэлгээнд ховор тохиолддог далд татварыг ногдуулдаг.

Гуравдугаарт, хамгийн чухал нь тухайн функцэд зориулж тусгайлан бүтээгдсэн програм хангамж хэрэгтэй эсэхээс асуугаарай. Олон бизнесүүд аль хэдийн өнгөлсөн, засвар үйлчилгээтэй бүтээгдэхүүн хэлбэрээр байдаг хяналтын самбар, CRM систем, нэхэмжлэхийн урсгал, хуваарь гаргах интерфэйс зэрэг дотоод хэрэгслүүдийг бий болгоход хөгжүүлэгчдийн хэдэн сарын цагийг зарцуулдаг. Mewayz гэх мэт платформ нь бизнесийн үйл ажиллагааны бүх хүрээг хамарсан модулиуд бүхий 138,000 гаруй хэрэглэгчдэд үйлчилдэг бөгөөд бизнесийн стандарт функцүүдэд зориулж захиалгат хөгжүүлэлтийн хэрэгцээг бүхэлд нь арилгаж чадна. Энэ нь таны хөгжүүлэлтийн багийг таны бүтээгдэхүүний үнэхээр өвөрмөц тал дээр анхаарлаа төвлөрүүлэхэд чөлөөлдөг — ямар ч бэлэн хэрэгсэлээр хангаж чадахгүй онцлог шинж чанарууд.

1. Өөрийн захиалгат кодыг шалгах: Одоо байгаа платформ дээр байгаа дотоод хэрэглүүр давхардсан функцийг тодорхойлох
2. Бодит өртгийг тооцоолох: Зөвхөн анхны хөгжүүлэлт биш, байнгын засвар үйлчилгээ, аюулгүй байдлын засварууд болон онцлог шинж чанаруудын хүсэлтийг харгалзан үзэх
3. Нэгдмэл байдлыг үнэлэх: Өөрийн одоогийн SaaS захиалгыг тоолж, нэгдсэн платформтой харьцуулах
4. Өөрийн ялгааг хамгаалаарай: Таны бизнесийг бусдаас ялгарах онцлог шинж чанаруудын хувьд тусгай хөгжүүлэлтийн нөөц нөөцлөөрэй

Ирээдүй бол санаатай сонголтуудад хамаарна

1,000 мөрийн SPA хүрээний эргэн тойронд байгаа сэтгэл хөдөлгөм нь уг хүрээний тухай биш юм. Энэ нь програм хангамжийг хөгжүүлэхэд чиглэсэн өсөн нэмэгдэж буй хөдөлгөөний тухай юм - хэрэгслүүдийг зах зээлд ноёрхож байгаадаа биш харин асуудалд тохирсон учраас сонгох явдал юм. JavaScript экосистем нь сүүлийн арван жилийг шинж чанар, хийсвэрлэлийн зэвсгийн уралдаанд зарцуулсан. Микро фрэймворк, серверээр бүтээгдсэн HTML болон платформын уугуул API-уудаар дүрслэгдсэн эсрэг хөдөлгөөн нь прагматизм руу чиглэсэн залруулга юм.

Бизнесийн хувьд энэ өөрчлөлт хоёрдмол утгагүй эерэг байна. Энэ нь илүү олон сонголт, сэлгэн залгах зардал бага, онолын бүрэн бүтэн байдлаас илүү хялбар, хурдыг эрхэмлэдэг хөгжүүлэгчийн соёл гэсэн үг. Та WordPress болон захиалгаар бүтээгдсэн сайтын аль нэгийг нь сонгож буй бие даасан бизнес эрхлэгч эсвэл дараагийн дотоод хэрэгслээ бүтээх эсвэл худалдан авах эсэхээ үнэлдэг CTO эсэхээс үл хамааран ижил зарчим үйлчилнэ: хамгийн сайн технологи бол ард талд алга болж, хэрэглэгчдэдээ үйлчлэхэд анхаарлаа төвлөрүүлэх боломжийг олгодог.

1000 мөрийн бүтэц нь хүч чадал нь нарийн төвөгтэй байдал шаарддаггүй гэдгийг бидэнд сануулдаг. Хамгийн үр дүнтэй бизнесүүд ба хамгийн үр дүнтэй хэрэгслүүд нь яг хэрэгтэй зүйлээ хийдэг бөгөөд өөр юу ч биш юм.