Vytváranie superrýchlych a bezpečných webových stránok pomocou CMS nie je nič veľké. Alebo je to?

Môžem vašu stránku rozbiť? Máte tam nejaké zvyšné skripty, ktoré môžem využiť? Existuje spôsob, ako ukradnúť vaše poverenia a zmeniť obsah na vašom webe? Môžem získať prístup k súkromným informáciám? Nie? Si si istý? Alebo sa to nikdy nedozviem, pretože načítanie vašej stránky trvá veky?

V určitom okamihu pri vytváraní webových stránok musíte myslieť na výkon a bezpečnosť. Nezáleží na tom, či pracujete na svojom osobnom webe alebo na webe svojho klienta. Je to rovnaké ako zálohovanie miestnych súborov. Existujú ľudia, ktorí robia pravidelné zálohy, a ľudia, ktorí ešte o nijaké neprišli, takže sú menej naklonení tomu.

Tradičný CMS

Ak používate tradičný systém na správu obsahu (CMS), situácia je pre vás komplikovanejšia. Tieto systémy obsahujú veľa funkcií. Musia pokryť všetky možné prípady použitia, ktoré by mohla mať každá webová stránka. To znamená kód. Veľa kódu. Tisíce súborov. A to nie je všetko - administračné rozhrania musia poskytovať pekné používateľské rozhranie, aby ste mohli nakonfigurovať všetky tieto funkcie. Potenciálne ďalších niekoľko tisíc súborov.

Bezpečnosť

Nie je to váš kód, však? Malo by to už byť teda bezpečné. Mnoho dodávateľov CMS sa snaží čo najlepšie zaistiť bezpečnosť svojich implementácií. Stále musia kryť veľa súborov. A každý jeden súbor môže obsahovať chybu, nejaký kód, ktorý tu zostal, alebo možno parameter reťazca dotazu, ktorý sprístupňuje databázu. To samo osebe môže vytvoriť potenciálnu zraniteľnosť.

Používanie open-source CMS môže byť ešte nebezpečnejšie, pretože implementácia je verejne známa. Áno, môžete namietať, že open-source je výhodný. Ktokoľvek môže prispieť a opraviť nájdené problémy. Týka sa to však iba problémov, ktoré sú už známe. Útočníci by si svoje činy pravdepodobne nechali pre seba. Aj keď sa problém našiel a vyriešil, stále musíte vynaložiť veľa úsilia na zabezpečenie toho, aby bol váš web aktualizovaný. Aktualizácie musíte vykonať zakaždým, keď je vydaná rýchla oprava zabezpečenia.

Ak sa zaujímate o štatistiky v reálnom svete, pozrite sa na správu hacknutej webovej stránky od spoločnosti Sucuri.

Čo by teda chceli útočníci urobiť s vašou webovou stránkou? V podstate sa chcú zmocniť vašich údajov, aby mohli zneužiť váš web tak, že:

  • Získanie prístupu k databáze pomocou jedného zo skriptov. To je zvyčajne prípad vlastných zvyšných skriptov, testovacích stránok a ďalších.
  • Ohrozenie a zneužitie vašich tajných údajov. Konfiguračné súbory sú typickou možnosťou ukladania rôznych tajných kľúčov a poverení do iných služieb alebo databáz.
  • Úprava obsahu vášho webu.
  • Zneprístupnenie vášho webu, tj. Vypnutie.

Výkon

Keď implementujete svoju webovú stránku v tradičnom CMS, musíte si ju obvykle prispôsobiť, takže tu budú súbory CMS a vaše vlastné súbory. Všetky je potrebné kompilovať a potom spolu s predkompilovanými knižnicami preniesť do pamäte servera skôr, ako server môže skutočne začať spracovávať požiadavky na vaše webové stránky. Alebo ešte horšie, ak používate riešenie založené na interpretovanom jazyku, ako je PHP, interpretujte všetok kód pre každú požiadavku.

Zdá sa, že váš web funguje dobre, tak prečo by vás to malo znepokojovať? Pretože:

  • platíte za výpočtový výkon servera
  • skompilujete a skopírujete kód funkcií, ktoré nikdy nechcete použiť
  • vaši návštevníci webových stránok čakajú na odpoveď

Čas do prvého bajtu týchto webových stránok môže byť oveľa viac ako 1 sekunda. Iste, dá sa to optimalizovať, ale potom trávite čas a peniaze vymýšľaním toho, ako zmierniť problémy s výkonom a zvyčajne skončíte s vylepšením CPU a pamäte, alebo ešte horšie, s pridaním ďalšieho servera.

Skontrolujte svoje stránky pomocou nástroja Google PageSpeed ​​alebo získajte podrobnejšiu analýzu pomocou nástroja SpeedCurve a zistite, ako sa im darí.

Webové stránky založené na rozhraní API

Webové stránky postavené na rozhraní API umožňujú veľkú flexibilitu. Opýtajte sa sami seba, potrebujete správu obsahu? Ak je to tak, môžete použiť bezhlavý CMS. Potrebujete ukladať odoslané formuláre? Perfektné, využite formulárovú službu. Tvoríte webovú stránku pre horský hotel a chcete zobraziť predpoveď počasia? Existuje pre vás meteorologická služba s jej API.

Počet súborov použitých na týchto webových stránkach zodpovedá ich funkčnosti. Ale čo administračné rozhranie pre editáciu obsahu? Neboj sa Bezhlavý CMS spracováva túto časť za vás. Nie je potrebný žiadny ďalší kód, ktorý by ste museli hostovať alebo udržiavať.

Bezpečnosť

Pri používaní služieb API nepotrebujete na vrchu svojej webovej stránky službu správy. Všetky komponenty konfigurujete pri vytváraní webových stránok. Rovnako ako zložka počasia, ktorá by mala zobrazovať predpoveď počasia na tri dni. Alebo že by na hlavnej stránke mali byť štyri blogové príspevky. Zvyšok dynamického obsahu je možné spravovať v bezhlavom CMS.

Hlavnou výhodou tohto prístupu je, že nepotrebujete databázu. Máte pravdu, k útočníkovi nemôže získať prístup jediný bod úložiska dát.

Ak je váš web založený na JavaScripte, jeho implementácia je v zásade otvorená. Môže byť kompilovaný, ale všetko, čo je poskytnuté prehliadaču, je čitateľné. To je ešte ďalšia výhoda. Áno, ktokoľvek môže dopytovať na koncové body služieb priamo. Publikovaný obsah, ktorý z nich získate, sa aj tak zobrazí na vašom webe, iba sa zmení na krajší vizuál. Je to ako so spravodajskými článkami na webových stránkach a čítačkami RSS. V prípade citlivého obsahu môžete každého používateľa kedykoľvek autentifikovať prostredníctvom inej služby, získať jeho jedinečný prístupový token a pomocou neho požiadať o citlivý obsah prostredníctvom zabezpečeného protokolu.

Ak budete mať na pamäti, že implementácia JS je otvorená pre všetkých, a správate sa k citlivým údajom správnym spôsobom, budete mať oveľa menej práce, aby ste zabezpečili svoje webové stránky. To, že nemáte databázu a nevyužívate všetky služby API prostredníctvom zabezpečených kanálov, zatvára takmer všetky dvere pre potenciálneho útočníka.

Výkon

V tomto scenári poskytuje webový server iba aktíva. Obchodná logika vašej aplikácie je uložená v súbore JS. Obsah z rôznych koncových bodov sa zhromažďuje prostredníctvom asynchrónnych požiadaviek prehľadávačov návštevníkov.

Asynchronizovať žiadosti o získanie obsahu zo služieb tretích strán? To musí byť pomalé, však? No určite, nejaký čas to trvá. Koncové body ich doručenia sú však zvyčajne zostavené pre rýchlosť, sú hostované v cloude a sú veľmi flexibilné. Môžete si tiež zvoliť bezhlavý CMS, ktorý používa na doručenie CDN, jedným z nich je Kentico Cloud. Takto bude žiadosť vždy spracovaná dátovým centrom, ktoré je geograficky najbližšie ku každému z vašich návštevníkov.

Aj keď na vytvorenie jednej stránky použijete viac služieb, všetky tieto požiadavky sú asynchrónne. Návštevníci čakajú iba na toho najpomalšieho. Keď sa stránka skladá na serveri používajúcom tradičný CMS, všetka komunikácia s databázou a inými službami je zvyčajne synchrónna. Server preto čaká na dokončenie každej transakcie a potom začne ďalšiu. A po tom všetkom sa všetko spojí a odošle späť ako jedna veľká odpoveď.

Zistite, ako dlho webovému serveru trvalo spracovanie prichádzajúcich požiadaviek (svetlo žlté pozadie). Po celú túto dobu návštevník aktívne čaká a nemôže začať sťahovať obrázky a ďalšie položky. Prehliadač návštevníka ich pozná až po prijatí odpovede.

Web založený na API je oveľa rýchlejší, pretože počiatočná odpoveď so statickým súborom HTML je okamžitá. Prehliadač stiahne obchodnú logiku webu ako jeden z prvkov a vygeneruje všetky nasledujúce asynchrónne požiadavky na obsah. Návštevník vidí plne vykreslenú stránku oveľa rýchlejšie a tiež vidí, že sa niečo deje. Keď čakajú na stránku vykreslenú serverom, vidia iba predbežné načítanie v paneli s adresou prehliadača. Celkové zlepšenie výkonu webových stránok založených na API je v tomto prípade viac ako 50%. Môže byť oveľa vyššia v závislosti od implementácie webových stránok.

Statické webové stránky

Prečo by sme sa teda mali trápiť riešením výkonu, ak už máme web založený na API?

Pretože webový server poskytuje iba statické súbory a prostriedky, jeho výkon je dobrý. Skutočnosť, že dynamický obsah sa zhromaždí neskôr, keď sa webová stránka vykresľuje v prehliadačoch návštevníkov, môže viesť k niektorým artefaktom. Návštevníci môžu vidieť prázdny komponent, ktorý sa vyplní, keď dostane údaje z asynchrónnej požiadavky atď. Ľudia s pomalým pripojením na internet alebo so staršími počítačmi to môžu považovať za znepokojujúce.

Čo s tým môžeme urobiť? Nie, nepridáme žiadne predbežné načítania. Aký je to pocit, keď vidíš nekonečný predpínač, ktorý sa iba točí a točí a točí? Naše webové stránky môžeme nastaviť na statické, ale udržiavať ich dynamické.

Koncept statických stránok je o výstupe z vášho webu. Začína sa to obsahom. Redaktori zvyčajne neaktualizujú obsah tak často. Webovú stránku je potrebné zostaviť na základe každej jednej žiadosti (ako to robia tradičné redakčné systémy). Myšlienka je podobná ukladaniu do pamäte cache - ukladanie generovaných údajov alebo stránok do pamäte. Ale statické stránky idú o niečo ďalej. Celý web, všetky stránky s celým obsahom, sa generujú zakaždým, keď editor zverejní obsah. Takže ak máte vo svojom blogu 153 blogových príspevkov, bude mať web teraz 153 statických stránok (plus niektoré ďalšie, ako napríklad domovská stránka, kontakt a ďalšie).

Ako budete spravovať 153 stránok? No nie. Stále však spravujete iba implementáciu jednej dynamickej stránky. Statická stránka je generovaná kombináciou vašej implementácie s obsahom z bezhlavého CMS. Takže keď je k dispozícii nový obsah, web sa znova vygeneruje automaticky.

Uvidíte, že výhoda rýchlosti nie je až taká významná v porovnaní s dynamickými webovými stránkami založenými na API. Avšak:

  • vaši návštevníci dostanú stránku a všetok obsah v prvej odpovedi. Nebudú sa pozerať na stránku, ktorá sa buduje. Ich prehliadače nemusia vytvárať ďalšie asynchrónne požiadavky na obsah
  • všetky nasledujúce požiadavky sa správajú rovnako
  • návštevníci sa pohybujú medzi súborom statických stránok, čo je veľmi rýchle
  • niektoré nástroje na generovanie statických stránok umožňujú návštevníkom ďalšie vynikajúce funkcie, ako je predbežné načítanie prepojených stránok (vďaka čomu je okamžitá navigácia k nim) alebo zobrazenie obrázkov v nízkej kvalite pred úplným stiahnutím.

To všetko zanechá u vašich návštevníkov dojem bleskurýchleho webu.

Každý web je samozrejme iný. Možno budete potrebovať niektoré funkcie prispôsobenia alebo chcete zobraziť citlivý obsah. V týchto prípadoch môžete kombinovať obidva prístupy. Majte statický web a stále používajte služby založené na API na doručovanie obsahu, ktorý sa medzi návštevníkmi líši.

Záver

Výkonové a bezpečnostné aspekty každého servera sú veľmi dôležité. Tradičné CMS sú zvyčajne náročnejšie na zdroje ako webové stránky založené na API, ale poskytujú viac funkcií priamo z krabice.

Na druhej strane, webové stránky založené na API sú oveľa rýchlejšie a bezpečnejšie. Umožňujú vám ušetriť peniaze na hosťovaní a vašim návštevníkom poskytujú lepší zážitok.

Statické stránky sa v dnešnej dobe stávajú veľkým hitom, pretože ich výkon je zďaleka najlepší. Umožní vám tiež vytvoriť čiastočne statické a čiastočne dynamické stránky založené na JavaScripte, ktoré sú prehľadne indexovateľné vyhľadávacími nástrojmi.

Je váš web už statický? Použili ste nejaké generátory statických stránok? Dajte mi vedieť o svojich skúsenostiach v sekcii komentárov nižšie.

V mojom ďalšom článku vám ukážem, ako vytvoriť web na Vue.js pomocou statického generátora stránok.

Ďalšie články v sérii:

  1. Ako začať prvýkrát vytvárať pôsobivú webovú stránku
  2. Ako sa rozhodnúť pre najlepšiu technológiu pre váš web?
  3. Ako zapnúť webovú stránku pomocou Vue.js a s minimálnym úsilím
  4. Ako zmiešať Headless CMS s webom Vue.js a platiť nulu
  5. Ako zaistiť zabezpečenie odosielania formulárov na webových stránkach API
  6. Vytváranie superrýchlych a bezpečných webových stránok pomocou CMS nie je nič veľké. Alebo je to?
  7. Ako vygenerovať statický web pomocou Vue.js v krátkom čase
  8. Ako rýchlo nastaviť proces zostavenia statickej stránky