Pinakamahusay na Static Site Generator

Pinakamahusay na Static Site Generator


Ang proseso ng pagbuo ng isang website ay may dalawang bahagi: nagbibigay ka ng nilalaman, at pagkatapos ay ang iyong CMS – WordPress, o anuman ang pinili mong gamitin – tumatagal ng nilalaman na iyon, pinagsasama ito sa iyong napiling tema at iyong napiling mga template, at gumagawa ng isang website mula dito para sa iyong mga customer o sa iyong mga mambabasa na basahin. Ngunit ang dalawang bahaging ito ay hindi kailangang gawin nang magkasama: maaari silang paghiwalayin sa isa’t isa, at iyon ang a static site generator (SSG) ay.

Sa gabay na ito, ipapaliwanag namin kung ano ang henerasyon ng static site at ang mga benepisyo nito, at ilista ang sampung pinakamahusay na static site generator upang magbigay ng ilang patnubay kung paano pumili sa pagitan nila.

Paano Gumagana ang isang Static Site Generator? At Bakit Gumamit ng Isa?

Karamihan sa mga CMSes, tulad ng nabanggit, ay gumawa ng dalawang bagay: isinasagawa nila ang iyong nilalaman sa HTML sa pamamagitan ng pagsasama-sama nito sa iyong mga tema at template, at pagkatapos ay ginagawa nilang magagamit ang HTML bilang isang website. Ang isang static na site generator ay naghati sa proseso na ito: ang bahagi kung saan ang iyong nilalaman ay nakabukas sa HTML ay nangyayari sa iyong sariling computer, na nagbibigay sa iyo ng isang folder na puno ng mga HTML file. Pagkatapos ay i-upload mo ang mga file na HTML sa web, kung saan magagamit ang mga ito bilang isang website sa lahat.

Ngunit bakit ginagawa ito? Mayroong isang bilang ng mga pakinabang.

Ang una ay seguridad. Dahil ang iyong website, ang bagay na nakikipag-ugnay sa mga tao, ay simpleng HTML, at mas mahirap para sa ito na mai-hack. At dahil ang mga static site generator, na naglalaman ng lahat ng computer code na gumagawa ng trabaho, ay tumatakbo lamang sa iyong sariling computer at hindi nalantad sa mas malawak na mundo, hindi rin ito mai-hack. Nangangahulugan ito na ang mga pag-update ng seguridad ay higit sa lahat ay hindi kinakailangan; hindi mo na kailangang maabala sa mga regular na popup na nagsasabi sa iyo na i-update ang iyong CMS, i-update ang iyong mga plugin, i-update ang iyong site.

Para sa ilan, maaaring ito ay sapat na dahilan sa sarili, ngunit mayroong isang pangalawang pangunahing benepisyo sa static na henerasyon ng site: pagganap.

Ang isang website na ginawa mula sa static HTML ay may kakayahang mag-load ng mas mabilis kaysa sa isa kung saan kinakailangang maproseso sa bawat pagbisita. Sa halip na ang nilalaman at tema ay pinagsama sa tuwing nakikita ng isang bisita ang site, ang gawaing ito ay ginagawa nang isang beses sa oras ng henerasyon sa iyong computer at pagkatapos ay hindi na kinakailangan. Sa halip, ang website ay nasa makikita na form.

Ang mas mahusay na pagganap ay nakikinabang sa iyong website sa lahat ng uri ng mga paraan. Ang iyong mga customer ay mas malamang na panatilihin ang pagtingin at mas mababa ang mga bounce rate,  Ang mas mabilis na oras ng pag-load ng pahina ay mahusay para sa SEO dahil ang Google at iba pang mga search engine ay pinahahalagahan ang mabilis na pagganap at mapalakas ang iyong mga ranggo.

Ang problema sa trapiko ay hindi isang problema; kung bigla kang magkaroon ng isang spike sa bilang ng mga bisita, ito ay hawakan ng maayos, at hindi ka na makakakita ng isa sa mga “502 Bad Gateway” na mensahe kapag ang isang site ay na-overload sa sandaling ito ay naging tanyag.

Sa lahat ng mga pilak na linings bagaman mayroong isang ulap, at para sa static na henerasyon ng site, hindi mo maikakaila na maging handa nang maging mas teknikal upang magamit ang diskarteng ito para sa iyong site.

Ang paghihiwalay ng “yugto ng henerasyon” at ang “yugto ng paglalathala” ay kailangang maunawaan, at ang mga static na tagalikha ng site, sa pangkalahatan, ay may posibilidad na ipalagay ang kaunti pa sa isang teknikal na baseline ng kaalaman kaysa sa karaniwang uri ng mga dynamic na CMS. Sa partikular, ang karamihan sa mga static na tagalikha ng site ay nangangailangan ng hindi bababa sa isang maliit na pamilyar sa linya ng utos: ang mga app na ito ay may posibilidad na itulak sa pamamagitan ng pagpapatakbo ng mga utos, sa halip na sa pamamagitan ng pagturo at pag-click.

Dahil sa pangangailangan para sa command line, ang mga static na tagagawa ng site ay maaaring hindi para sa lahat, ngunit kung handa mong isaalang-alang ang pag-ikot ng iyong mga manggas at pagsisid ng kaunti kaysa sa normal, may ilang mga potensyal na tagumpay na dapat.

Tingnan natin ang sampung pinakamahusay na mga tagabuo ng static site, at pagkatapos ay kung paano pumili sa pagitan nila.

Ang 10 Pinakamahusay na Static Site Generator

1. Hugo

logo ng hugo

Si Hugo ay nasa mas madaling pagtatapos ng mga generator na batay sa static na batay sa terminal upang mai-set up at gamitin. Ang kanilang dokumentasyon, lalo na sa kung paano i-install ang Hugo at patakbuhin ito, ay lubos na komprehensibo at hindi ito kailangan mong i-install muna ang isang bagong tindahan ng pakete at pagkatapos ay mai-install ang Hugo.

Ito ay may isang malaking halaga ng mga itinakdang tema na ginagawang mas madali upang pumili at piliin ang hitsura na gusto mo para sa iyong site, at isa sa mga pangunahing tampok na taglay ng Hugo team ay ang build-speed nito.

Ang paggawa ng pagbabago sa iyong site sa pamamagitan ng pagdaragdag o pag-edit ng nilalaman, o pagpapalit ng tema, ay nangangailangan na “muling itayo” ang site: iyon ay, tatakbo sa proseso ng pagsasama-sama ng nilalaman ng isang tema sa HTML, para sa bawat pahina. Kahit na ang isang maliit na pagkakaiba sa pagganap ng bilis ng pagbuo ay maaaring makagawa ng pagkakaiba sa pagitan ng mga hinihintay mong segundo at naghihintay ka ng ilang minuto upang makita ang resulta ng isang pagbabago na nagawa mo, at si Hugo ay nagsusumikap sa pagiging pinakamabilis sa ito.

Kung nagtatayo ka ng isang site mula sa mayroon nang data, pagkatapos ay “Hugo’s”Nilalaman ng Data-driven“Tampok na ginagawang medyo madali upang magkaroon ng nilalaman ng site na ibinigay sa CSV o JSON format. Maaari itong maging isang kapaki-pakinabang na paraan upang makagawa ng ilang mga umiiral na data na nais mong ilantad sa mundo sa isang mas maginhawang fashion na maaari silang mag-browse at mag-navigate nang hindi na kailangang sunugin ang mga Excel o Google Sheets.

2. Eleventy, o 11ty11ty logo

Ang 11ty ay isa sa mga mas bagong SSG ngunit binabalak ang listahan ng katanyagan. Sinisingil nito ang sarili bilang “isang mas simpleng static site generator”. Gayunpaman, nangangailangan ito ng isang makatwirang halaga ng teknikal na pamilyar (at ang dokumentasyon nito ay sumasalamin dito) ngunit para sa mga nakakakaunawa nito, ginagawa nito ang mga bagay sa isang matikas na paraan.

11ty ay nakasulat sa JavaScript at sa gayon ay nangangailangan node.js magtrabaho; kakailanganin mong i-install iyon muna kung wala ka, at pagkatapos ay mag-install ng 11ty mula sa linya ng utos.

Ang 11ty ay tumatagal ng isang malakas na pagtingin sa pagganap ng website, hanggang sa kung saan buong pagmamalaki nilang ipinapakita ang isang leaderboard ng pagganap ng mga website na binuo kasama nito, at napakapopular sa mga web propesyonal at sa mga curating at pagbuo ng bukas na web nang mas pangkalahatan.

3. Pelicankumuha ng pelican logo

Ang Pelican ay isang halip na natanggal na aesthetic ngunit ang paggamit ng Python bilang pinagbabatayan nito na wika ng programming, ay may potensyal na mapalawak sa halos anumang direksyon na maaaring gusto mo sa isang maliit na dagdag na programa.

Mayroon itong suporta para sa pag-import ng data ng site mula sa WordPress, na ginagawang mas madali kaysa sa ilang iba pang mga SSG na lumipat mula sa isang umiiral na site ng WordPress papunta sa static na site generation nang hindi nawawala ang iyong kasalukuyang pag-setup. At tulad ng mas mahusay na klase ng SSG ay idinisenyo upang mahawakan ang isang buong website at hindi lalo na para sa pag-blog.

Ang Pelican ay mayroong isang bahagyang matarik na kurba sa pagkatuto, bagaman, na ginagawang mas angkop para sa isang tao kahit na isang maliit na pamilyar sa Python. Katulad nito, kakailanganin mo ang pag-install ng Python sa iyong computer na, at walang gabay na ibinigay para sa mga hindi tagabuo na wala ito … ngunit kung ikaw ay isang uri ng developer na gumagamit na ng Python pagkatapos ang Pelican ay isang mabuting lugar upang magsimula.

4. Nikola

logo ng nikola

Nikola ay tumatagal ng isang napaka “bateryang kasama” na diskarte sa static na henerasyon ng site, na nagbibigay ng napaka detalyadong mga template para sa pag-blog at buong website, ngunit din ang mga gallery ng imahe at paghahanap sa iba pang mga bagay.

Ito ay may isang medyo malawak na listahan ng mga plugin at mga tema din. Kahit na ang Nikola ay may posibilidad patungo sa mas teknikal na pagtatapos ng merkado; kakailanganin mong maging lubos na tiwala sa pagbuo ng Python na gumawa ng higit pa sa mga pangunahing kaalaman dito, ngunit kung ikaw ay pagkatapos ay nag-aalok si Nikola ng higit na pagpapalawak kaysa sa marami sa mga kahalili.

Ang listahan ng mga tema ay hindi masyadong komprehensibo, kaya kung naghahanap ka ng isang bagay na maganda kaysa sa impormasyong pagkatapos ay maaaring mas mahusay na tumingin sa ibang lugar. Gayunpaman, ang bilis ng muling itayo ay mas mabilis kaysa sa karamihan ng iba pang mga posibilidad.

Tulad ng Pelican, naghihintay ang Nikola na mayroon ka nang Python na magagamit at hindi ipinaliwanag kung paano magagawa iyon, kaya kung hindi mo at nasa Windows, baka gusto mong tingnan ang isa sa iba pang mga alternatibo.

5. GatsbyGatsby logo

Tinatawag ni Gatsby ang sarili nitong isang static na generator ng PWA. Ang PWA ay ang term ng sining para sa Progressive Web Apps, na maaaring gumana nang offline, idagdag sa home screen sa mobile, at iba pa. Posible na gawin ito sa anumang website, kasama na ang mga nabuo sa iba pang mga SSG, ngunit nagbibigay si Gatsby ng suportang ito sa labas ng kahon.

Para sa mga pamilyar sa React, ang library ng sangkap ng web, ang Gatsby ay maaaring maging isang mahusay na pagpipilian dahil ito ay itinayo sa paligid nito, upang maaari mong magamit muli ang pamilyar na kapaligiran na alam mo na – talaga, Ang sariling website ng React ay itinayo kasama ang Gatsby.

Kinakailangan ng Gatsby kapwa mga node.js at ang system control system git na mai-install. Mayroon silang isang medyo detalyadong hanay ng mga pahina ng dokumentasyon tungkol sa kung paano mag-set up ng isang kapaligiran ng Gatsby, kabilang ang sa Windows, ngunit sa halip ay isang kasangkot na proseso kung hindi ka pamilyar sa command line. Gayundin, ang dokumentasyon ay pinaghalo ang Windows at Linux at Mac tagubilin nang sabay-sabay, ginagawa itong medyo mahirap sundin.

6. Jekyll

Jekyll logo

Si Jekyll ay isa sa pinakalumang mga static na tagalikha ng site ngunit nasa ilalim pa rin ng aktibong pag-unlad, at ang katanyagan nito ay higit sa lahat ang nagbunsod ng baha ng pagbabago ng SSG na nagawa ang lahat ng iba pa sa listahang ito..

Ang isa sa mga pag-angkin nito sa katanyagan ay na ito ay binuo sa serbisyo ng hosting ng Github code: posible na i-save ang iyong nilalaman sa isang Github imbakan, isang cloud drive para sa code, sa isang paraan na tatakbo ni Github ang Jekyll code para sa ikaw at i-convert ang nilalaman sa isang website nang hindi mo kinakailangang magpatakbo ng anumang code.

Sa ganitong paraan, ang Mga Pahina ng Github Maaaring magamit ang serbisyo bilang host para sa iyong static na website nang walang bayad, at ang dokumentasyon para sa kung paano i-set up ito ay medyo malinaw at madaling sundin.

Gayunpaman, kakailanganin pa rin nito ang ilang pamilyar sa git system control code. Siyempre, posible ring patakbuhin ang iyong sarili sa iyong sariling computer, at nagbibigay sila isang hanay ng mga tagubilin sa pag-install ng Windows, kahit na ang Windows ay hindi opisyal na suportado.

7. Statiq.web

statiq logo

Ang Statiq Web ay isang bagong karagdagan sa mga ranggo ng SSG, at nasa ilalim pa rin ng mabigat na pag-unlad. Kaya pinakamahusay na angkop para sa mga handang makisali sa prosesong iyon at sumali sa komunidad sa pamamagitan ng pagpapakain ng mabuti kung ano ang mahusay at kung ano ang hindi.

Ang natatanging punto ng pagbebenta ay na ito ay binuo gamit. NET, kaya ang mga may ilang kaalaman sa programming stack ay makahanap ng Statiq Web na angkop sa kanilang mayroon nang karanasan. Ito ay isang halimbawa ng proyekto ng mas pangkalahatang Statiq Framework, kaya ang isang mas may karanasan na programmer ay maaaring yakapin ang mas malaking balangkas upang makabuo ng isang bagay na mas kumpleto.

8. Publii

Logo ng Publii

Ang Publii, hindi tulad ng karamihan sa iba pang mga static na tagalikha ng site dito, ay hindi isang tool na command-line. Sa halip, ito ay isang desktop application, magagamit para sa Windows, Mac, at Linux.

Maaari mong isipin ito bilang isang bagay na katulad ng WordPress, maliban na sa halip na maging isang website ito ay isang application na tumatakbo sa iyong computer at pagkatapos ay bumubuo ng isang static na bersyon ng website, handa nang mailathala tulad ng ginagawa ng iba pang mga tool.

May mga built-in na tool sa pag-publish upang itulak ang static na website sa iba’t ibang mga umiiral na host, tulad ng Netlify at mga lokasyon ng pag-host sa ulap. Mayroon itong isang sistema ng pag-import para sa pag-convert ng isang umiiral na site ng WordPress sa Publii, at isang pamilihan ng mga bayad na antas ng propesyonal na antas.

Ang application mismo ay libre at bukas-mapagkukunan at may isang aktibong komunidad ng mga gumagamit na tumutulong sa isa’t isa sa isang forum ng talakayan. Publii ay ang hindi bababa sa teknikal ng mga static na tagagawa ng site na kasalukuyang inaalok, habang nagkakaroon pa rin ng halos lahat ng kanilang mga pakinabang. Para sa isang taong hindi naghahanap upang makakuha ng isang coding at command-line na batay sa diskarte ito ay isang mahusay na solusyon.

9. WP2Static

logo ng wp2static

Ang WP2Static ay tumatagal ng ibang naiibang pamamaraan kaysa sa iba pang mga static na tagalikha ng site: hindi ito mahigpit na isang tagapamahala ng site sa sarili nito. Sa halip, ito ay gumagana nang magkasama sa WordPress upang makagawa ng isang static na bersyon ng isang site na pinamamahalaan ng WordPress mismo.

Sa wika ng paglalarawan sa itaas, iniwan ng WP2Static ang WordPress na namamahala sa iyong pag-edit at i-on ang iyong nilalaman sa HTML sa pamamagitan ng pagsasama nito sa iyong mga tema at template. Pagkatapos ay hakbang sa WP2Static upang kunin ang HTML at mai-publish ito bilang plain HTML sa isang lugar sa web.

Mayroong ilang mga halatang benepisyo sa mga ito: maaari mong panatilihin ang paggamit ng WordPress interface na pamilyar sa iyo, at mayroon kang access sa lahat ng malawak na aklatan ng mga tema at plugin ng WordPress.

Gayunpaman, may mga pagbagsak din kasama nito: mahalaga na ilipat ang iyong pag-install ng WordPress sa ibang lugar, kung hindi, mawawala ka ng karamihan sa mga pakinabang ng static na henerasyon ng site.

Ang pagkakaroon ng static ng iyong site ay nagbibigay ng mahusay na mga benepisyo sa seguridad dahil hindi ka gumagamit ng isang dynamic na produkto tulad ng WordPress, ngunit sa solusyon na ito, ikaw ay gumagamit pa rin ng WordPress. Kaya mahalagang itago ang WordPress na iyon sa isang lugar kung saan hindi ito maaabot ng sinuman maliban sa iyo.

Ang teknolohiyang pag-iisip ay maaaring ilipat ito sa isang nakatagong server, o magpatakbo ng WordPress sa kanilang mga lokal na makina. Ang isang tao na hindi agad naiintindihan kung paano gawin iyon ay maaaring nahihirapang sundin ang mga konsepto na kasangkot, at maaari itong nakalilito na alalahanin na ang site na iyong (nakatago) WordPress ay bumubuo ay hindi ang site na nakikita ng publiko hanggang sa pindutan ng publish ay pinindot.

Gayunpaman, kung sanay na sanay ka sa interface ng gumagamit ng WordPress, o mabigat na nakatali sa partikular na mga plugin ng WP o mga tema na mahirap hanapin o magagamit sa isa pang SSG, ang WP2Static ay maaaring maging perpektong solusyon.

10. Susunod.js

Nextjs logo

Next.js ay mas mababa ng isang generator para sa mga static na site, at higit pa isang balangkas para sa pagbuo ng mga static na aplikasyon gamit ang React. Sinusuportahan nito ang static na henerasyon ng site (at na-update ang suporta na ito upang higit na mapabuti ito sa 9.3 na paglabas sa unang bahagi ng 2020), at kung naghahanap ka upang makabuo ng isang application na may React at nais ang pinakamahusay na-sa-klase na static na site ng pagbuo ng up na, Susunod .js ay isang magandang lugar upang tumingin.

Ipinapalagay nito ang isang mahusay na kaalaman sa parehong JavaScript at React, kaya hindi ito para sa mga hindi pang-teknikal, at ang dokumentasyon ay nakasalalay sa isang kapaligiran ng Linux o Mac na binibigyan ng labi ng serbisyo sa mga gumagamit ng Windows.

Ngunit para sa kung ano ang halaga, napakahusay nito, at medyo may buzz sa paligid nito na nangangahulugang nakakakuha ito ng mabibigat na pag-unlad at sumusulong sa mga paglukso at hangganan.

Paano Piliin ang Tamang Isa?

Doon mo ito: ang listahan ng kung ano ang pipiliin.

Ngunit paano mo pipiliin ang isa na pinakamahusay para sa iyo?

Buweno, kung hindi ka interesado na pumasok sa command line, pagkatapos ay tingnan ang Publii, tiyak. Kung ikaw ay isang dalubhasa sa WordPress na naghahanap upang maging static, magtatayo ang WP2Static sa mga malawak na kasanayan na mayroon ka. Kung nagmamalasakit ka tungkol sa bilis ay 11ty o Hugo ang iyong mga lugar upang tignan.

Kung mayroon kang karanasan sa isang partikular na wika ng programming o kapaligiran, pumili ng isang static na site generator na nakasulat sa wikang iyon upang magamit ang iyong pinakamahusay na mga kasanayan: para sa Python, gumamit ng Pelican o Nikola; para sa Ruby, Jekyll, para sa .NET, Statiq, para sa React tingnan ang Next.js at Gatsby, at para sa JavaScript, 11ty.

Kung lilipat ka mula sa isang umiiral na site ng WordPress, siguraduhing suriin na ang iyong tool na pinili ay may isang import para sa iyong nilalaman ng WordPress (pinaka-gawin), at magkaroon ng kamalayan na ang eksperimento ay mura at madali. Maaari kang bumuo ng isang site na static na pagsubok na may ilang nilalaman ng nilalaman at makabuo lamang ito sa iyong sariling computer nang walang nakakakita dito..

Subukan ang mga tool na gusto mo ng tunog ng – lahat sila ay libre, at bukas na mapagkukunan – at pagkatapos ay handa ka na, simulan ang pagtingin sa mga lugar upang ma-host ang iyong static na nilalaman.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map