Делаем неубиваемый сайт: статика и динамика

Это ста­тья об устрой­стве сай­тов и интер­не­та. Она будет полез­на тем, кто хочет зани­мать­ся веб-разработкой, стро­ить сверх­быст­рые сай­ты и неуби­ва­е­мую инфраструктуру. 

Что значит «зайти на сайт»

Когда вы захо­ди­те на сайт, на самом деле вы нику­да не захо­ди­те. Вы дела­е­те запрос на некий уда­лён­ный сер­вер, а он вам при­сы­ла­ет в ответ доку­мент. Доку­мент при­ле­та­ет в ваш бра­у­зер, бра­у­зер его ана­ли­зи­ру­ет и рису­ет вам веб-страничку. Вам кажет­ся, что вы при­шли в интер­нет, но на самом деле это кусо­чек интер­не­та при­шёл к вам. 

Когда вы кли­ка­е­те по ссыл­ке, вам кажет­ся, что вы пере­ме­сти­лись с одной стра­ни­цы на дру­гую. На самом деле вы отпра­ви­ли новый запрос на сер­вер, полу­чи­ли ответ, бра­у­зер сно­ва нари­со­вал стра­ни­цу. Вы нику­да не пере­ме­сти­лись, вы лишь полу­чи­ли новый кусо­чек интернета. 

Теперь вопрос — отку­да появи­лись эти кусоч­ки интер­не­та, кото­рые вам прислали? 

Статичные сайты

Изна­чаль­но сай­ты в интер­не­те хра­ни­лись и отда­ва­лись так:

  1. На уда­лён­ном ком­пью­те­ре лежа­ли доку­мен­ты. В бук­валь­ном смыс­ле: доку­мен­ты с тек­сто­вой инфор­ма­ци­ей. Один доку­мент соот­вет­ство­вал одной странице. 
  2. На этом же ком­пью­те­ре рабо­та­ла спе­ци­аль­ная про­грам­ма — веб-сервер. Она зна­ла, что если у неё запро­си­ли какой-то сайт, нуж­но отдать какой-то кон­крет­ный доку­мент. Мож­но пред­ста­вить, что сер­вер — это сотруд­ник архи­ва: вы запро­си­ли доку­мент — вам его отдали. 
  3. Сле­до­ва­тель­но, ска­чать из интер­не­та мож­но было толь­ко те доку­мен­ты, кото­рые физи­че­ски лежа­ли где-то на серверах.

Если вам на сай­те нуж­но было иметь 30 стра­ниц, вам нуж­но было иметь 30 доку­мен­тов, кото­рые физи­че­ски будут лежать на сервере. 

Напри­мер, вот так выгля­дят доку­мен­ты сай­та, на кото­ром мы пилим наши про­ек­ти­ки — mihailmaximov.ru. В «корне» нам досту­пен толь­ко доку­мент index.html — это глав­ная стра­ни­ца. Ещё сле­ва вид­ны пап­ки с про­ек­та­ми. Что­бы заве­сти новый про­ект, мы дела­ем новую пап­ку и скла­ды­ва­ем в неё нуж­ные документы.

Делаем неубиваемый сайт: статика и динамика

Что нам даёт статичный сайт (и в чём мешает)

✅ Сайт рабо­та­ет мол­ние­нос­но — отда­вать зара­нее заго­тов­лен­ные доку­мен­ты очень лег­ко, с этим спра­вит­ся даже мало­мощ­ный ком­пью­тер типа Arduino. А мощ­ные веб-сервера — и подав­но: стра­нич­ки будут при­ле­тать мгновенно. 

✅ Сайт очень труд­но взло­мать: един­ствен­ный спо­соб навре­дить сай­ту — это полу­чить пря­мой доступ в фай­ло­вую систе­му сер­ве­ра и вруч­ную напа­ко­стить в каж­дом фай­ле (или сте­реть их). Это не невоз­мож­но, но в совре­мен­ных реа­ли­ях доволь­но трудно. 

✅ Сайт эле­мен­тар­но пере­но­сить: если сло­мал­ся один сер­вер, про­сто копи­ру­е­те фай­лы из резерв­ной копии на новый сер­вер, и сайт рабо­та­ет как рань­ше. Ника­кой допол­ни­тель­ной настрой­ки, кро­ме пере­на­прав­ле­ния адре­са для запро­сов. Ника­ких баз дан­ных, вер­сий движ­ка и гло­баль­ных переменных.

✅ Дёше­во хостить: услу­га хостин­га фай­лов — самая дешё­вая из всех, пото­му что хра­не­ние и раз­да­ча фай­лов рас­хо­ду­ют мало ресурсов. 

❌ Сайт неудоб­но обнов­лять: что­бы обно­вить инфор­ма­цию на какой-то стра­ни­це, нуж­но отре­дак­ти­ро­вать нуж­ный файл и загру­зить его на сер­вер. Если нуж­но вне­сти изме­не­ния в 30 стра­ниц, эту опе­ра­цию при­дёт­ся повто­рить 30 раз. Напри­мер, если вы хоти­те доба­вить новый пункт меню. 

❌ Сайт не под­стра­и­ва­ет­ся под поль­зо­ва­те­ля: ста­тич­ный сайт может толь­ко выда­вать вам зара­нее заго­тов­лен­ную инфор­ма­цию. Если нуж­но сфор­ми­ро­вать кор­зи­ну поку­пок или поис­кать что-то кон­крет­но под ваш запрос, ста­ти­ки недо­ста­точ­но. Исклю­че­ние — скрип­ты, кото­рые мож­но выпол­нить пря­мо в браузере.

👉 Ста­тич­ные сай­ты иде­аль­ны для сайтов-визиток или сайтов-книг, где один раз напи­сал инфор­ма­цию и она там дол­го лежит.

Динамические сайты

Что­бы обой­ти огра­ни­че­ния ста­тич­ных сай­тов, при­ду­ма­ли такую схему: 

  1. Вме­сто фай­лов с кон­тен­том на сер­ве­ре рабо­та­ет спе­ци­аль­ная про­грам­ма — назо­вём её поваром. 
  2. Повар полу­ча­ет заказ, напри­мер, «При­го­товь мне глав­ную стра­ни­цу это­го сай­та». Повар берёт нуж­ные ингре­ди­ен­ты и соби­ра­ет из них глав­ную стра­ни­цу, отдаёт.
  3. Полу­ча­ет­ся, что каж­дая стра­ни­ца сай­та как бы «гото­вит­ся» под ваш запрос с помо­щью спе­ци­аль­ной программы. 

Если в ста­тич­ных сай­тах сер­вер выпол­нял роль работ­ни­ка архи­ва, то в дина­ми­че­ских — это такой офи­ци­ант: он при­ни­ма­ет у вас запрос, отно­сит на кух­ню, даёт зада­ние пова­ру, а когда блю­до гото­во, при­но­сит вам. 

На самом сер­ве­ре боль­ше не хра­нят­ся как тако­вые доку­мен­ты — теперь они соби­ра­ют­ся под инди­ви­ду­аль­ный запрос из суще­ству­ю­щих заготовок. 

Напри­мер, в базе дан­ных лежит тыся­ча това­ров, а вы про­си­те пока­зать 10 самых попу­ляр­ных. Не про­бле­ма: шеф-повар дела­ет запрос в базу дан­ных, полу­ча­ет ответ, соби­ра­ет под вас стра­нич­ку и отдаёт. 

Когда сайт дина­ми­че­ский, его фак­ти­че­ские фай­лы никак не свя­за­ны с его содер­жи­мым. Напри­мер, на скрин­шо­те — пап­ка систе­мы дина­ми­че­ских сай­тов WordPress. Каж­дый из 14 фай­лов — это, услов­но гово­ря, повар, кото­рый дела­ет свою часть рабо­ты. Но эти 14 пова­ров вме­сте могут подать нам бес­ко­неч­ное коли­че­ство дина­ми­че­ских доку­мен­тов. То, что здесь 14 фай­лов, никак не свя­за­но с тем, сколь­ко и каких стра­ниц может выдать наш сайт.

Динамические сайты

Что даёт динамический сайт (и в чём мешает)

✅ Содер­жи­мое сай­та мож­но адап­ти­ро­вать под поль­зо­ва­те­ля: стра­ни­цы зака­зов, лич­ные каби­не­ты, резуль­та­ты поис­ка, соц­се­ти, фору­мы, ком­мен­та­рии — всё это дина­ми­че­ские про­дук­ты. В ста­ти­ке реа­ли­зо­вать всё это невозможно. 

✅ Про­стое обнов­ле­ние и допол­не­ние: при жела­нии раз­ра­бот­чик может сде­лать удоб­ный интер­фейс добав­ле­ния мате­ри­а­лов на сайт — как в тех же соц­се­тях. Вам не нуж­но загру­жать фай­лик в «Фейс­бук» или VK.com, вы про­сто наби­ра­е­те текст пря­мо в браузере. 

✅ Инте­гра­ции: сайт может сам обра­щать­ся к базам дан­ных, спра­ши­вать дан­ные у дру­гих сер­ви­сов, на лету под­гру­жать ваши дан­ные из раз­ных источников.

❌ Сайт рабо­та­ет мед­лен­нее: сбор­ка стра­ниц на лету тре­бу­ет боль­ше вре­ме­ни, чем отда­ча доку­мен­та. Счёт идёт на деся­тые доли секун­ды, но когда у тебя очень мно­го поль­зо­ва­те­лей, это может быть проблемой. 

❌ Есть про­стран­ство для взло­ма: хакер может завер­нуть в свой запрос какой-нибудь вре­до­нос­ный код (в духе «повар, при­го­товь мне торт с клю­ча­ми от тво­ей квар­ти­ры»). Если спе­ци­аль­но не преду­смат­ри­вать такие ата­ки, мож­но полу­чить дыру в безопасности. 

❌ Непро­сто обслу­жи­вать и пере­но­сить. Дина­ми­че­ские сай­ты тре­бу­ют уста­нов­ки на сер­вер осо­бен­но­го сбо­роч­но­го соф­та (напри­мер, PHP или Python). Этот софт дол­жен быть опре­де­лён­ной вер­сии, с опре­де­лён­ным набо­ром моду­лей. Их нуж­но пра­виль­но меж­ду собой увя­зать. Это не так про­сто, как ско­пи­ро­вать фай­ли­ки и пере­ки­нуть на дру­гой сервер. 

Гибридный вариант: кеширование

Допу­стим, нам нуж­но сов­ме­стить плю­сы двух под­хо­дов. Мы хотим, что­бы сайт был пре­дель­но быст­рый и взло­мо­стой­кий, но при этом его было лег­ко обнов­лять. На этот слу­чай при­ду­ма­ли кеширование.

Кэши­ро­ва­ние похо­же на отдел кули­на­рии в супер­мар­ке­те: пова­ра зара­нее наго­то­ви­ли сала­тов и нажа­ри­ли кури­цы, а мы берём эту еду с при­лав­ка. С одной сто­ро­ны, не нуж­но ждать, что повар при­го­то­вит кури­цу кон­крет­но под нас. С дру­гой сто­ро­ны, эта кури­ца может быть не самой свежей. 

Кэши­ро­ва­ние рабо­та­ет похо­жим обра­зом: берёт­ся дви­жок сай­та, на его осно­ве гене­ри­ру­ет­ся куча доку­мен­тов. И даль­ше эта куча ведёт себя как ста­тич­ный сайт. Когда это может быть полезно: 

  • В бло­ге, где есть ста­тьи, но нет ком­мен­та­ри­ев. Кеш нуж­но обнов­лять, толь­ко когда доба­ви­лась новая статья.
  • В прин­ци­пе, с ком­мен­та­ри­я­ми тоже мож­но: если кто-то ком­мен­ти­ру­ет ваши ста­тьи раз в час, мож­но сра­зу пере­стра­и­вать кеш, и у вас будет акту­аль­ная копия сайта. 
  • На сайте-каталоге, где нель­зя офор­мить заказ. Кеш обнов­ля­ет­ся толь­ко при добав­ле­нии ново­го товара. 
  • В спра­воч­ни­ках, энцик­ло­пе­ди­ях, кни­гах: испра­вил опе­чат­ку — кеш обновился. 

Что дальше

На осно­ве идеи кеши­ро­ва­ния при­ду­ма­ли тех­но­ло­гию гене­ра­ции ста­тич­ных сай­тов. Это когда у вас есть куча исход­но­го тек­ста (напри­мер, инструк­ция от слож­ной систе­мы). Вы гово­ри­те: «Офор­ми мне эту кучу тек­ста по такому-то шаб­ло­ну». Спе­ци­аль­ный гене­ра­тор оформ­ля­ет эту кучу, а вы полу­ча­е­те пач­ку ста­тич­ных доку­мен­тов, кото­рые рабо­та­ют как мол­ние­нос­ный ста­тич­ный сайт. 

В сле­ду­ю­щем выпус­ке пого­во­рим про такие гене­ра­то­ры ста­ти­че­ских сайтов.

Текст и редактура:

Мак­сим Ильяхов

Худож­ник:

Даня Бер­ков­ский

Кор­рек­тор:

Ири­на Михеева

Вёрст­ка:

Мария Дро­но­ва

Соц­се­ти:

Ана­ста­сия Гаврилова