No-build, no-NPM, SSR-first JavaScript framework inā inaina ʻoe iā React, aloha iā HTML

Ka Paʻakikī Pono ʻole o ka Pūnaewele Hou

Inā ua maloʻo kou ʻuhane i ka hoʻonohonoho ʻana i ka Webpack, ka luʻu ʻana i nā node_modules, a i ʻole e hākōkō me nā hewa hydration no ka hāʻawi ʻana i kahi pou blog maʻalahi, ʻaʻole ʻoe wale nō. ʻO ka ʻāina JavaScript hou, i hoʻomalu ʻia e React a me kāna kaiaola kūkulu-mea hana-kaumaha, manaʻo pinepine ʻia e like me ka hoʻohana ʻana i kahi mea hoʻoheheʻe pōkole e kau i kahi kiʻi kiʻi. He aha inā he ala hoʻi i ka maʻalahi? ʻO ka hoʻi ʻana i nā ikaika kumu o ka pūnaewele—semantic HTML, lean CSS, a me ka JavaScript i hoʻonui ʻia—me ka ʻole o ka hoʻolilo ʻana i ka manaʻo o nā mea hoʻohana? ʻO kēia ka ʻōlelo hoʻohiki o ka nalu hou o ka no-build, no-NPM, SSR-first frameworks. No nā mea hoʻomohala makemake i ka HTML, waiwai i ka mana maka o ka polokalamu kele pūnaewele, a manaʻoʻiʻo ʻo ka manawa holo maikaʻi loa ka mea i hoʻokomo mua ʻia ma nā mea hoʻohana a pau.

Hoʻopaʻa ʻia i ka Papahana: ʻAʻohe Kūkulu, ʻAʻohe NPM

ʻO ka ʻatikala "ʻaʻole-kūkulu" kahi hoʻihoʻi koʻikoʻi i ka noʻonoʻo. ʻO ia hoʻi kāu code—HTML, CSS, JavaScript—ʻo ia ke code e holo ana ma ka polokalamu kele pūnaewele. ʻAʻohe unuhi, ʻaʻohe pae hoʻopili, a ʻo ka mea nui, ʻaʻohe kali i nā hilinaʻi e hoʻoiho a hōʻuluʻulu. Kākau ʻoe i ka JavaScript hou me nā modula ES, a na ka polokalamu kele pūnaewele e hoʻokele maoli. Hoʻopau kēia i kahi ʻāpana holoʻokoʻa o ka hāmeʻa, hoʻonohonoho, a me ka hoʻololi ʻana i nā poʻo. Pēlā nō, ʻaʻole "no-NPM" ʻaʻole hiki iā ʻoe ke hoʻohana i nā hale waihona puke; 'o ia ho'i ke ho'ohana nei 'oe i nā CDN hou e like me jsDelivr a i 'ole Skypack e ho'okomo pololei ma o ka URL ma kāu code 'ao'ao polokalamu, a 'oi aku ka maika'i, nīnau 'oe inā makemake 'oe i kēlā hale waihona puke 200kb no kahi hana ma'alahi. ʻO ka hopena, ʻoi aku ka wikiwiki o ka hoʻomohala kūloko, ka hōʻano hou ʻana o ka polokalamu kele pūnaewele, a me kahi pūʻulu hana, ʻo ia ka mea āu i kākau ai.

"Pono ka maʻalahi o ka polokalamu i ka hana i hāʻawi ʻia i ka mea hoʻohana, ʻaʻole i ka paʻakikī o kāna mea hana. Ua lawa ka mana o ka pūnaewele.

Ka Hoʻolilo ʻana i ka ʻaoʻao Server: ʻAʻole he manaʻo hope, akā ʻo ka Foundation

SSR-first frameworks flip the modern Single Page App (SPA) model on its head. Ma kahi o ka hoʻouna ʻana i kahi faila HTML blank a me kahi puʻupuʻu JavaScript monolithic e hāʻawi i nā mea āpau ma ka mea kūʻai aku, hāʻawi lākou i ka HTML piha, interactive ma ke kikowaena. Loaʻa koke ka polokalamu kele pūnaewele i ka ʻikepili koʻikoʻi, he mea koʻikoʻi ia no ka hana, SEO, a me ka ʻike mea hoʻohana. A laila "hoʻomaʻemaʻe" ʻo JavaScript ʻaoʻao i kēia HTML, e hoʻopili ana i nā mea hoʻolohe hanana i mea e launa pū ai. Hāʻawi kēia ala i ka wikiwiki i ʻike ʻia o nā pūnaewele static me ka ikaika o nā polokalamu pūnaewele. No nā pūnaewele paʻakikī, nā panela admin, a i ʻole nā ​​ʻaoʻao kūʻai aku - kahi wikiwiki ʻo Time-to-Interactive a me ka ʻike ʻimi ʻana he kī nui - ʻaʻole hiki ke lanakila kēia hale hana. Hoʻopili pono ʻia ia me kahi ʻikepili pāʻoihana modular, kahi e hāʻawi maikaʻi ʻia ai nā ʻike kumu a me nā hana ma mua o ka hoʻonui ʻia ʻana.

No ke aha e pili ai kēia ala no nā noi pāʻoihana

No ka lako polokalamu ʻoihana, ʻo ka hilinaʻi, ka mālama ʻana, a me ke kahe ʻikepili maʻemaʻe ka mea nui. ʻOi aku ka HTML-mua, SSR-centric kumu hoʻohālike ma aneʻi. ʻO ke kikowaena ke kumu hoʻokahi o ka ʻoiaʻiʻo, ka mālama pono ʻana i ka mokuʻāina a me ka loina ʻoihana. ʻO ka UI kahi hōʻike pololei o kēlā moku'āina, hāʻawi ʻia e like me HTML. Hoʻokumu kēia i kahi kumu hoʻohālike noʻonoʻo i maʻalahi ka noʻonoʻo ʻana ma mua o nā puʻupuʻu reactive, client-state-synchronization puzzles o nā papa hana SPA nui aʻe. He ikaika loa ia no nā noi kaumaha, dashboards, a me nā mea hana i loko. Hoʻomaopopo nā paepae e like me Mewayz i kēia. Ma ka hāʻawi ʻana i kahi OS pāʻoihana modular e hiki ke hoʻohui pono me ka lean, focused frontends, hiki iā lākou ke hana i nā hui e kūkulu i ka loiloi pāʻoihana paʻakikī i loko o kahi kaiapuni i hoʻopaʻa ʻia ʻoiai e hōʻike ana ma o ka wikiwiki, SEO-friendly, a me ka maʻalahi. ʻO kēia hoʻokaʻawale ʻana o nā hopohopo—nā modula hope paʻa, ka pae mua HTML nani—ʻo ia ke kumu o ka ʻenehana ʻoihana hiki ke hoʻonui ʻia a mālama ʻia.

Hiki ke hōʻuluʻulu ʻia nā pōmaikaʻi nui o kēia hoʻololi paradigm:

• Hōʻā ʻana: Hoʻouna ʻia ka JavaScript liʻiliʻi i ka mea kūʻai aku, e alakaʻi ana i nā manawa hoʻouka ʻoi aku ka wikiwiki a me ka ʻoi aku ka maikaʻi o nā Koko Pūnaewele.
• ʻOliʻoli o ka mea hoʻomohala: He kaʻina hana hoʻomohala maʻalahi me ka ʻole o ka hoʻonui ʻana i ke kaulahao mea hana mau a me ka aie hoʻonohonoho.
• SEO i kūkulu ʻia: Hiki ke kolo koke ʻia ka HTML i unuhi piha ʻia mai ke kikowaena e nā ʻenekini huli.
• Hoʻonui i ka hilinaʻi: ʻO ka liʻiliʻi o ka ʻaoʻao o ka mea kūʻai aku JavaScript ʻo ia ka liʻiliʻi o nā hewa manawa holo e pili ana i ka launa pū ʻana o nā mea hoʻohana; hana mau ka maʻiʻo kumu.
• Hoʻonui Holomua: Hoʻohaʻahaʻa maikaʻi ʻia ka hana, e hōʻoia ana i ka hiki a me ka ʻike kumu no nā mea hoʻohana a pau.

Ke ʻimi nei i kou ala e hoʻi ai i ka hoʻomohala pūnaewele maʻalahi

ʻAʻole kēia no ka hōʻole ʻana i ka hoʻomohala pūnaewele hou; e pili ana i ka hoʻomaʻemaʻe ʻana. He koho ia e hoʻokahua i ka ʻike o ka mea hoʻohana a me ka noʻonoʻo o ka mea hoʻomohala ma mua o ka hoʻowalewale o ka abstraction hou a paʻakikī loa. E hāʻawi i kēia ala maʻalahi nā ʻōnaehana like ʻo Astro (me kāna mau mokupuni pili pili), Hoʻonui, a i ʻole ka hoʻohana ʻana i nā ʻāpana pūnaewele me ka ʻaoʻao kikowaena. Nīnau lākou iā ʻoe e hoʻomaka me nā mea i hana maikaʻi ʻia e ka pūnaewele—hāʻawi i nā palapala—a kau i ka pilina ma nā wahi wale nō e pono ai. Ke hoʻohui pū ʻia me kahi ʻōnaehana backend ikaika a modular e like meMewayz, nāna e mālama i nā hana ʻoihana paʻakikī a me ka pono o ka ʻikepili, loaʻa iā ʻoe kahi synergy ikaika. Loaʻa iā ʻoe kahi ʻaoʻao paʻakikī a wikiwiki e hōʻike ana i kāu loiloi ʻoihana, ʻaʻole ka paʻakikī o kāna kūkulu ʻana. No ka poʻe e hoʻomanaʻo nei, ʻo ka punaewele e pili ana i ka ʻike a me ka hana, hāʻawi maʻalahi.

Nīnau pinepine

Ka Paʻakikī Pono ʻole o ka Pūnaewele Hou

Inā ua maloʻo kou ʻuhane i ka hoʻonohonoho ʻana i ka Webpack, ka luʻu ʻana i nā node_modules, a i ʻole e hākōkō me nā hewa hydration no ka hāʻawi ʻana i kahi pou blog maʻalahi, ʻaʻole ʻoe wale nō. ʻO ka ʻāina JavaScript hou, i hoʻomalu ʻia e React a me kāna kaiaola kūkulu-mea hana-kaumaha, manaʻo pinepine ʻia e like me ka hoʻohana ʻana i kahi mea hoʻoheheʻe pōkole e kau i kahi kiʻi kiʻi. He aha inā he ala hoʻi i ka maʻalahi? ʻO ka hoʻi ʻana i nā ikaika kumu o ka pūnaewele—semantic HTML, lean CSS, a me ka JavaScript i hoʻonui ʻia—me ka ʻole o ka hoʻolilo ʻana i ka manaʻo o nā mea hoʻohana? ʻO kēia ka ʻōlelo hoʻohiki o ka nalu hou o ka no-build, no-NPM, SSR-first frameworks. No nā mea hoʻomohala makemake i ka HTML, waiwai i ka mana maka o ka polokalamu kele pūnaewele, a manaʻoʻiʻo ʻo ka manawa holo maikaʻi loa ka mea i hoʻokomo mua ʻia ma nā mea hoʻohana a pau.

Hoʻopaʻa ʻia i ka Papahana: ʻAʻohe Kūkulu, ʻAʻohe NPM

ʻO ka ʻatikala "ʻaʻole-kūkulu" kahi hoʻihoʻi koʻikoʻi i ka noʻonoʻo. ʻO ia hoʻi kāu code—HTML, CSS, JavaScript—ʻo ia ke code e holo ana ma ka polokalamu kele pūnaewele. ʻAʻohe unuhi, ʻaʻohe pae hoʻopili, a ʻo ka mea nui, ʻaʻohe kali i nā hilinaʻi e hoʻoiho a hōʻuluʻulu. Kākau ʻoe i ka JavaScript hou me nā modula ES, a na ka polokalamu kele pūnaewele e hoʻokele maoli. Hoʻopau kēia i kahi ʻāpana holoʻokoʻa o ka hāmeʻa, hoʻonohonoho, a me ka hoʻololi ʻana i nā poʻo. Pēlā nō, ʻaʻole "no-NPM" ʻaʻole hiki iā ʻoe ke hoʻohana i nā hale waihona puke; 'o ia ho'i ke ho'ohana nei 'oe i nā CDN hou e like me jsDelivr a i 'ole Skypack e ho'okomo pololei ma o ka URL ma kāu code 'ao'ao polokalamu, a 'oi aku ka maika'i, nīnau 'oe inā makemake 'oe i kēlā hale waihona puke 200kb no kahi hana ma'alahi. ʻO ka hopena, ʻoi aku ka wikiwiki o ka hoʻomohala kūloko, ka hōʻano hou ʻana o ka polokalamu kele pūnaewele, a me kahi pūʻulu hana, ʻo ia ka mea āu i kākau ai.

Ka Hoʻolilo ʻana i ka ʻaoʻao Server: ʻAʻole he manaʻo hope, akā ʻo ka Foundation

SSR-first frameworks flip the modern Single Page App (SPA) model on its head. Ma kahi o ka hoʻouna ʻana i kahi faila HTML blank a me kahi puʻupuʻu JavaScript monolithic e hāʻawi i nā mea āpau ma ka mea kūʻai aku, hāʻawi lākou i ka HTML piha, interactive ma ke kikowaena. Loaʻa koke ka polokalamu kele pūnaewele i ka ʻikepili koʻikoʻi, he mea koʻikoʻi ia no ka hana, SEO, a me ka ʻike mea hoʻohana. A laila "hoʻomaʻemaʻe" ʻo JavaScript ʻaoʻao i kēia HTML, e hoʻopili ana i nā mea hoʻolohe hanana i mea e launa pū ai. Hāʻawi kēia ala i ka wikiwiki i ʻike ʻia o nā pūnaewele static me ka ikaika o nā polokalamu pūnaewele. No nā pūnaewele paʻakikī, nā panela admin, a i ʻole nā ​​ʻaoʻao kūʻai aku - kahi wikiwiki ʻo Time-to-Interactive a me ka ʻike ʻimi ʻana he kī nui - ʻaʻole hiki ke lanakila kēia hale hana. Hoʻopili pono ʻia ia me kahi ʻikepili pāʻoihana modular, kahi e hāʻawi maikaʻi ʻia ai nā ʻike kumu a me nā hana ma mua o ka hoʻonui ʻia ʻana.

No ke aha e pili ai kēia ala no nā noi pāʻoihana

No ka lako polokalamu ʻoihana, ʻo ka hilinaʻi, ka mālama ʻana, a me ke kahe ʻikepili maʻemaʻe ka mea nui. ʻOi aku ka HTML-mua, SSR-centric kumu hoʻohālike ma aneʻi. ʻO ke kikowaena ke kumu hoʻokahi o ka ʻoiaʻiʻo, ka mālama pono ʻana i ka mokuʻāina a me ka loina ʻoihana. ʻO ka UI kahi hōʻike pololei o kēlā moku'āina, hāʻawi ʻia e like me HTML. Hoʻokumu kēia i kahi kumu hoʻohālike noʻonoʻo i maʻalahi ka noʻonoʻo ʻana ma mua o nā puʻupuʻu reactive, client-state-synchronization puzzles o nā papa hana SPA nui aʻe. He ikaika loa ia no nā noi kaumaha, dashboards, a me nā mea hana i loko. Hoʻomaopopo nā paepae e like me Mewayz i kēia. Ma ka hāʻawi ʻana i kahi OS pāʻoihana modular e hiki ke hoʻohui pono me ka lean, focused frontends, hiki iā lākou ke hana i nā hui e kūkulu i ka loiloi pāʻoihana paʻakikī i loko o kahi kaiapuni i hoʻopaʻa ʻia ʻoiai e hōʻike ana ma o ka wikiwiki, SEO-friendly, a me ka maʻalahi. ʻO kēia hoʻokaʻawale ʻana o nā hopohopo—nā modula hope paʻa, ka pae mua HTML nani—ʻo ia ke kumu o ka ʻenehana ʻoihana hiki ke hoʻonui ʻia a mālama ʻia.

Ke ʻimi nei i kou ala e hoʻi ai i ka hoʻomohala pūnaewele maʻalahi

ʻAʻole kēia no ka hōʻole ʻana i ka hoʻomohala pūnaewele hou; e pili ana i ka hoʻomaʻemaʻe ʻana. He koho ia e hoʻokahua i ka ʻike o ka mea hoʻohana a me ka noʻonoʻo o ka mea hoʻomohala ma mua o ka hoʻowalewale o ka abstraction hou a paʻakikī loa. E hāʻawi i kēia ala maʻalahi nā ʻōnaehana like ʻo Astro (me kāna mau mokupuni pili pili), Hoʻonui, a i ʻole ka hoʻohana ʻana i nā ʻāpana pūnaewele me ka ʻaoʻao kikowaena. Nīnau lākou iā ʻoe e hoʻomaka me nā mea i hana maikaʻi ʻia e ka pūnaewele—hāʻawi i nā palapala—a kau i ka pilina ma nā wahi wale nō e pono ai. Ke hoʻohui pū ʻia me kahi ʻōnaehana backend ikaika a modular e like me Mewayz, nāna e mālama i nā hana ʻoihana paʻakikī a me ka pono o ka ʻikepili, loaʻa iā ʻoe kahi synergy ikaika. Loaʻa iā ʻoe kahi ʻaoʻao paʻakikī a wikiwiki e hōʻike ana i kāu loiloi ʻoihana, ʻaʻole ka paʻakikī o kāna kūkulu ʻana. No ka poʻe e hoʻomanaʻo nei, ʻo ka punaewele e pili ana i ka ʻike a me ka hana, hāʻawi maʻalahi.