{"id":333939,"date":"2022-06-01T21:00:17","date_gmt":"2022-06-01T21:00:17","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=333939"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=333939","title":{"rendered":"<span>Web Testing Specific<\/span>"},"content":{"rendered":"<div><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/646\/672\/0c8\/6466720c85e1d3001899c744fa713efb.png\" width=\"1340\" height=\"700\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/646\/672\/0c8\/6466720c85e1d3001899c744fa713efb.png\"\/><figcaption><\/figcaption><\/figure>\n<div class=\"persona\" persona=\"true\"><img decoding=\"async\" persona=\"true\" class=\"image persona__image\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/8f7\/c7c\/744\/8f7c7c744b8c3215f265322045c96333.jpg\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/8f7\/c7c\/744\/8f7c7c744b8c3215f265322045c96333.jpg\" data-blurred=\"true\"\/><\/p>\n<h5 class=\"persona__heading\" persona=\"true\">\u0410\u043d\u0430\u0442\u043e\u043b\u0438\u0439 \u0420\u044b\u0436\u0430\u043a\u043e\u0432<\/h5>\n<p>QA Engineer \u0432 Space307<\/p>\n<\/div>\n<p>\u0421\u0430\u043b\u044e\u0442, \u0425\u0430\u0431\u0440!<\/p>\n<p>\u041c\u0435\u043d\u044f \u0437\u043e\u0432\u0443\u0442 \u0410\u043d\u0430\u0442\u043e\u043b\u0438\u0439, \u0438 \u044f \u0440\u0430\u0431\u043e\u0442\u0430\u044e \u0432 \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u0438 <a href=\"https:\/\/space307.com\/\">Space307<\/a> \u0432 \u0434\u043e\u043b\u0436\u043d\u043e\u0441\u0442\u0438 QA-\u0438\u043d\u0436\u0435\u043d\u0435\u0440.<\/p>\n<p>\u0414\u043e\u043b\u0433\u0438\u043c \u0438 \u0443\u043f\u043e\u0440\u043d\u044b\u043c \u0442\u0440\u0443\u0434\u043e\u043c \u044f \u0438\u0441\u043a\u0430\u043b \u0438 \u0441\u043e\u0431\u0438\u0440\u0430\u043b \u0432\u043e\u0435\u0434\u0438\u043d\u043e, \u043d\u0430 \u043c\u043e\u0439 \u0432\u0437\u0433\u043b\u044f\u0434, \u0441\u0430\u043c\u0443\u044e \u043f\u043e\u043b\u0435\u0437\u043d\u0443\u044e \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u043e\u043c\u043e\u0436\u0435\u0442 \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c\u0441\u044f \u0432 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0435 Web-\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f.<\/p>\n<p>\u0412\u0441\u0451 \u044d\u0442\u043e \u043f\u043e \u0438\u0442\u043e\u0433\u0443 \u0440\u0430\u0437\u0440\u043e\u0441\u043b\u043e\u0441\u044c \u0438 \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043b\u043e\u0441\u044c \u0432 \u043d\u0435\u043a\u0438\u0439 \u0433\u0430\u0439\u0434, \u0445\u043e\u0442\u044f \u043f\u043e \u0437\u0430\u0434\u0443\u043c\u043a\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0431\u044b\u0442\u044c \u043a\u0440\u0430\u0442\u0435\u043d\u044c\u043a\u0438\u043c \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u043e\u043c \u0434\u043b\u044f \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0435\u0433\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f.<\/p>\n<p>\u041e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u0435 \u0441\u043f\u0430\u0441\u0438\u0431\u043e \u0445\u043e\u0447\u0443 \u0432\u044b\u0440\u0430\u0437\u0438\u0442\u044c \u043a\u043e\u043b\u043b\u0435\u0433\u0430\u043c, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u043c\u043e\u0433\u0430\u043b\u0438 \u0432 \u0441\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0438, \u0434\u043e\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0438 \u0438 \u0440\u0435\u0432\u044c\u044e \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0438. Simply the best!<\/p>\n<p>\u041f\u0435\u0440\u0435\u0434 \u043f\u0440\u043e\u0447\u0442\u0435\u043d\u0438\u0435\u043c: \u043d\u0438\u0447\u0442\u043e \u0432 \u044d\u0442\u043e\u043c \u043c\u0438\u0440\u0435 \u043d\u0435 \u0438\u0434\u0435\u0430\u043b\u044c\u043d\u043e, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043e \u043a\u0430\u043a\u0438\u0445-\u043b\u0438\u0431\u043e \u0437\u0430\u043c\u0435\u0447\u0430\u043d\u0438\u044f\u0445, \u0434\u043e\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f\u0445, \u0443\u0442\u043e\u0447\u043d\u0435\u043d\u0438\u044f\u0445 \u0438 \u043d\u0435\u0434\u043e\u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f\u0445 \u043f\u0438\u0448\u0438\u0442\u0435 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e, \u043d\u043e \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e \u0438 \u0432 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u0438\u0432\u043d\u043e\u0439 \u043c\u0430\u043d\u0435\u0440\u0435, \u043f\u043e\u0436\u0430\u043b\u0443\u0439\u0441\u0442\u0430 \ud83d\ude42<\/p>\n<p>\u0412\u0441\u044e \u043f\u043e\u043b\u0435\u0437\u043d\u043e\u0441\u0442\u044c \u0438\u0437 \u0444\u0438\u0434\u0431\u044d\u043a\u0430 \u043f\u0435\u0440\u0435\u0440\u0430\u0431\u043e\u0442\u0430\u044e \u0434\u043b\u044f \u043f\u0440\u043e\u043a\u0430\u0447\u043a\u0438 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0438.<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<th data-colwidth=\"193\" width=\"193\">\n<p>\u0426\u0435\u043b\u0435\u0432\u0430\u044f \u0430\u0443\u0434\u0438\u0442\u043e\u0440\u0438\u044f<\/p>\n<\/th>\n<td>\n<p align=\"left\">&#8212; Junior QA Engineer;<br \/>&#8212; \u041a\u0442\u043e \u043d\u0435 \u0437\u043d\u0430\u043a\u043e\u043c \u0441 Web&#8217;\u043e\u043c, \u043d\u043e \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u0443\u0435\u0442\u0441\u044f;<br \/>&#8212; \u041a\u0442\u043e \u0445\u043e\u0447\u0435\u0442 \u043e\u0441\u0432\u0435\u0436\u0438\u0442\u044c \u0437\u043d\u0430\u043d\u0438\u044f \u043e Web&#8217;\u0435.<\/p>\n<\/td>\n<\/tr>\n<tr>\n<th data-colwidth=\"193\" width=\"193\">\n<p>\u0426\u0435\u043b\u044c<\/p>\n<\/th>\n<td>\n<p align=\"left\">\u0421\u043e\u0431\u0440\u0430\u0442\u044c \u043c\u0430\u043a\u0441\u0438\u043c\u0443\u043c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u043e Web, \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0435\u0451 \u0432 \u0435\u0434\u0438\u043d\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u0434\u043b\u044f QA:<\/p>\n<p align=\"left\">&#8212; \u0417\u0434\u0435\u0441\u044c \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u0438\u043c\u0435\u0440\u043e\u0432 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0445 \u0442\u0435\u0441\u0442-\u043a\u0435\u0439\u0441\u043e\u0432<br \/>&#8212; \u0417\u0434\u0435\u0441\u044c \u0431\u0443\u0434\u0435\u0442 \u043e\u0431\u0449\u0435\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043e \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0435 Web&#8217;\u0430<br \/>&#8212; \u041d\u0430 \u0447\u0442\u043e \u043e\u0431\u0440\u0430\u0449\u0430\u0442\u044c \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043f\u0440\u0438 \u043f\u043e\u0434\u0433\u043e\u0442\u043e\u0432\u043a\u0435 \u043a \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044e Web&#8217;\u0430<br \/>&#8212; \u041d\u0435\u043a\u0430\u044f \u0443\u0441\u0440\u0435\u0434\u043d\u0451\u043d\u043d\u0430\u044f \u043c\u043e\u0434\u0435\u043b\u044c (\u0438\u0437 \u0447\u0435\u0433\u043e \u0441\u043e\u0441\u0442\u043e\u0438\u0442 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435)<br \/>&#8212; \u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u043c\u043e\u0433\u0443\u0442 \u0432 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438 Web&#8217;\u0430<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p><strong>Fast Travel:<\/strong><\/p>\n<ul>\n<li>\n<p><a href=\"#ustroistvo\">\u041a\u043b\u0430\u0441\u0441: \u0423\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#brauzer\">\u041a\u043b\u0430\u0441\u0441: \u0411\u0440\u0430\u0443\u0437\u0435\u0440 (\u041e\u0431\u043e\u0437\u0440\u0435\u0432\u0430\u0442\u0435\u043b\u044c)<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#verstka\">\u041a\u043b\u0430\u0441\u0441: \u0412\u0451\u0440\u0441\u0442\u043a\u0430<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#vvod\">\u041a\u043b\u0430\u0441\u0441: \u0412\u0432\u043e\u0434 (\u0423\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435)<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#nastrojka\">\u041a\u043b\u0430\u0441\u0441: \u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 (\u041f\u041e \u0434\u043b\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430)<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#dannye\">\u041a\u043b\u0430\u0441\u0441: \u0414\u0430\u043d\u043d\u044b\u0435<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#tehnologii\">\u041a\u043b\u0430\u0441\u0441: \u0422\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0438<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#nagruzka\">\u041a\u043b\u0430\u0441\u0441: \u041d\u0430\u0433\u0440\u0443\u0437\u043a\u0430<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#instrumenty\">\u041a\u043b\u0430\u0441\u0441: \u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b<\/a><\/p>\n<\/li>\n<\/ul>\n<h3>Web-\u043e\u0440\u0438\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 (+ \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439)<\/h3>\n<p><a class=\"anchor\" name=\"ustroistvo\" id=\"ustroistvo\"><\/a><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td data-colwidth=\"253\" width=\"253\">\n<p align=\"left\"><strong>\u041e\u0431\u043b\u0430\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"253\" width=\"253\">\n<p align=\"left\"><strong>\u041a\u043b\u0430\u0441\u0441<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0423\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"253\" width=\"253\">\n<p align=\"left\"><strong>\u041e\u0431\u044a\u0435\u043a\u0442\u044b<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212; Desktop (\u0441\u0442\u0430\u0446\u0438\u043e\u043d\u0430\u0440\u043d\u044b\u0439 \u041f\u041a, \u043d\u043e\u0443\u0442\u0431\u0443\u043a)<br \/>&#8212; Mobile (\u0441\u043c\u0430\u0440\u0442\u0444\u043e\u043d, \u043f\u043b\u0430\u043d\u0448\u0435\u0442)<br \/>&#8212; Other (SmartTV, \u0438\u0433\u0440\u043e\u0432\u0430\u044f \u043a\u043e\u043d\u0441\u043e\u043b\u044c)<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<ul>\n<li>\n<p>\u0423\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e \u2014 \u044d\u0442\u043e \u043d\u0435\u043a\u0430\u044f \u00ab\u0431\u0430\u0437\u0430\u00bb,\u00a0\u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442\u044c \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 Web&#8217;\u043e\u043c, \u0442\u043e, \u043a\u0430\u043a\u0438\u043c\u0438 \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043a\u0430\u043c\u0438 \u043e\u0431\u043b\u0430\u0434\u0430\u0435\u0442 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e, \u043a\u0430\u043a\u0438\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u044b \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u043d\u0430 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0435, \u043a\u0430\u043a\u0438\u0435 \u0441\u043f\u043e\u0441\u043e\u0431\u044b \u0432\u0432\u043e\u0434\u0430\/\u0432\u044b\u0432\u043e\u0434\u0430 \u0442\u0430\u043a \u0438\u043b\u0438 \u0438\u043d\u0430\u0447\u0435 \u0432\u043b\u0438\u044f\u044e\u0442 \u043d\u0430 \u044d\u0442\u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435.<\/p>\n<\/li>\n<li>\n<p>\u0412 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f, \u043a\u0430\u043a\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e Web&#8217;\u0430 \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0442\u044c: Desktop \u0438\u043b\u0438 Mobile.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 Web-\u0441\u0430\u0439\u0442\u044b (Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f) \u043d\u0435 \u0438\u043c\u0435\u044e\u0442 Mobile \u0432\u0435\u0440\u0441\u0438\u0439.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u0445 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430\u0445 \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u0442\u044c\u0441\u044f \u043d\u0430 \u043e\u0431\u044b\u0447\u043d\u0443\u044e (desktop) \u0432\u0435\u0440\u0441\u0438\u044e Web&#8217;\u0430.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043d\u0430 Desktop \u0432\u0435\u0440\u0441\u0438\u044e \u0432 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u043c \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435 Google Chrome:<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u041f\u0435\u0440\u0435\u0439\u0442\u0438 \u043d\u0430 Web-\u0441\u0430\u0439\u0442<\/p>\n<\/li>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c \u043c\u0435\u043d\u044e \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0433\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430<\/p>\n<\/li>\n<li>\n<p>\u0412\u044b\u0431\u0440\u0430\u0442\u044c \u043e\u043f\u0446\u0438\u044e \u00ab\u0412\u0435\u0440\u0441\u0438\u044f \u0434\u043b\u044f \u041f\u041a\u00bb (&#171;Desktop site&#187;)<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/aa6\/9be\/fd7\/aa69befd716046df050feb9c4f94dba1.png\" width=\"388\" height=\"402\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/aa6\/9be\/fd7\/aa69befd716046df050feb9c4f94dba1.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u041d\u0430 \u041f\u041a \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u044d\u043c\u0443\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e Web&#8217;\u0430.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 Google Chrome (\u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e DevTools):<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c DevTools \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 (F12 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e)<\/p>\n<\/li>\n<li>\n<p>\u0412\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043f\u0430\u043d\u0435\u043b\u044c \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430 (&#171;Toggle Device Toolbar&#187;)<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/0b9\/aac\/526\/0b9aac5267b0875c3e366064240bc4d4.png\" width=\"146\" height=\"54\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/0b9\/aac\/526\/0b9aac5267b0875c3e366064240bc4d4.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u0412 \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0435\u043c \u0441\u043f\u0438\u0441\u043a\u0435 &#171;Dimensions&#187; \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u044d\u043c\u0443\u043b\u0438\u0440\u0443\u0435\u043c\u043e\u0435 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0435 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/d4d\/40a\/4bf\/d4d40a4bf50bfc85408a83f7ea755301.png\" width=\"355\" height=\"45\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d4d\/40a\/4bf\/d4d40a4bf50bfc85408a83f7ea755301.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0440\u0430\u0437\u043b\u0438\u0447\u0438\u044f \u043c\u0435\u0436\u0434\u0443 Mobile Web \u0438 Desktop Web: \u043e\u0440\u0433\u0430\u043d\u044b \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u0439 (\u043a\u0443\u0440\u0441\u043e\u0440 \u0438\u043b\u0438 \u0442\u0430\u043f), \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0437\u0430\u0446\u0438\u044f \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430, \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044f \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 (\u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u0430\u044f \u0438\u043b\u0438 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u0430\u044f), \u043d\u0430\u0431\u043e\u0440 \u0438 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 UI \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 (\u0432 \u0442.\u0447. \u0438 \u0442\u0435\u043a\u0441\u0442), \u0438\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u044f \u0441 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u043e\u043c \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 GPS).<\/p>\n<\/li>\n<li>\n<p>\u0415\u0449\u0451 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0442\u0430\u043a\u043e\u0435 \u043f\u043e\u043d\u044f\u0442\u0438\u0435 \u043a\u0430\u043a PWA (&#171;<strong>Progressive Web Application<\/strong>&#171;) \u0432\u0435\u0440\u0441\u0438\u044f Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b (\u0438\u043b\u0438 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f), \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u043e \u0441\u0432\u043e\u0435\u0439 \u0441\u0443\u0442\u0438 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u0443\u044e \u0438 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u0443\u044e \u00ab\u0442\u0440\u0430\u043d\u0441\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e\u00bb \u0432 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0441 \u043f\u043e\u043c\u0435\u0449\u0435\u043d\u0438\u0435\u043c \u0438\u043a\u043e\u043d\u043a\u0438 \u043d\u0430 \u0434\u043e\u043c\u0430\u0448\u043d\u0438\u0439 \u044d\u043a\u0440\u0430\u043d\/\u0440\u0430\u0431\u043e\u0447\u0438\u0439 \u0441\u0442\u043e\u043b \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u043a \u043d\u0435\u043c\u0443.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>PWA \u043d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 Google Maps:<\/summary>\n<div class=\"spoiler__content\">\n<p>\u0427\u0442\u043e\u0431\u044b \u0443\u0437\u043d\u0430\u0442\u044c, \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u043b\u0438 Web-\u0441\u0430\u0439\u0442 PWA \u0432\u0435\u0440\u0441\u0438\u044e, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e:<\/p>\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c \u043c\u0435\u043d\u044e \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0433\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u043d\u0430\u043b\u0438\u0447\u0438\u0435 \u043e\u043f\u0446\u0438\u0438 &#171;\u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f&#187; (&#171;Install app&#187;)<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/0aa\/8f8\/db7\/0aa8f8db725dbc532a5e883d4802fd07.png\" width=\"274\" height=\"265\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/0aa\/8f8\/db7\/0aa8f8db725dbc532a5e883d4802fd07.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u0423\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c PWA \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/6cf\/c6e\/3bd\/6cfc6e3bdd17de72b5b435175d15f587.png\" width=\"734\" height=\"292\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/6cf\/c6e\/3bd\/6cfc6e3bdd17de72b5b435175d15f587.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"4\">\n<li>\n<p>\u0417\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c PWA \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/ddb\/2c6\/f18\/ddb2c6f1838ce67b8b441a11aab99672.png\" width=\"200\" height=\"200\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ddb\/2c6\/f18\/ddb2c6f1838ce67b8b441a11aab99672.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"5\">\n<li>\n<p>PWA \u0432\u0435\u0440\u0441\u0438\u044f Google Maps \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0442\u0430\u043a:<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/448\/ca5\/c6c\/448ca5c6cca28221c6f5c7e31f3779c8.png\" width=\"804\" height=\"1798\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/448\/ca5\/c6c\/448ca5c6cca28221c6f5c7e31f3779c8.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0422\u0430\u043a\u0436\u0435 \u043c\u043e\u0436\u043d\u043e \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c PWA \u0432\u0435\u0440\u0441\u0438\u044e \u0438 \u043d\u0430 \u041f\u041a:<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/add\/9b1\/e04\/add9b1e0491da6fd2247f74f5739be54.png\" width=\"320\" height=\"204\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/add\/9b1\/e04\/add9b1e0491da6fd2247f74f5739be54.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0438\u043b\u0438<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/90f\/365\/4a5\/90f3654a5c46573469c70378661cb86e.png\" width=\"434\" height=\"146\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/90f\/365\/4a5\/90f3654a5c46573469c70378661cb86e.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412\u043e\u0442 \u0442\u0430\u043a \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 desktop \u0432\u0435\u0440\u0441\u0438\u044f PWA:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/04f\/e70\/921\/04fe70921df4a256f0a82dc52925a07e.png\" width=\"2186\" height=\"1552\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/04f\/e70\/921\/04fe70921df4a256f0a82dc52925a07e.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<hr\/>\n<p><a class=\"anchor\" name=\"brauzer\" id=\"brauzer\"><\/a><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td data-colwidth=\"248\" width=\"248\">\n<p align=\"left\"><strong>\u041e\u0431\u043b\u0430\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041a\u043b\u0438\u0435\u043d\u0442<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"248\" width=\"248\">\n<p align=\"left\"><strong>\u041a\u043b\u0430\u0441\u0441<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0411\u0440\u0430\u0443\u0437\u0435\u0440 (\u041e\u0431\u043e\u0437\u0440\u0435\u0432\u0430\u0442\u0435\u043b\u044c)<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"248\" width=\"248\">\n<p align=\"left\"><strong>\u041e\u0431\u044a\u0435\u043a\u0442\u044b<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212; Google Chrome<br \/>&#8212; Firefox<br \/>&#8212; Safari<br \/>&#8212; Opera<br \/>&#8212; Microsoft Edge<br \/>&#8212; Web Desktop App (Chromium)<br \/>&#8212; UC Browser<br \/>&#8212; \u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u044b \u043d\u0430 Android (Mi Browser, Samsung Internet Browser, HUAWEI Browser \u0438 \u0434\u0440.)<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<ul>\n<li>\n<p>\u0415\u0441\u043b\u0438 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e \u044d\u0442\u043e \u00ab\u0431\u0430\u0437\u0430\u00bb, \u0442\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u2014 \u044d\u0442\u043e \u0442\u043e\u0447\u043a\u0430 \u0432\u0445\u043e\u0434\u0430 \u0432 Web. \u041a\u043b\u0438\u0435\u043d\u0442, \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u0443\u0436\u0435 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435 \u043e\u0431\u0449\u0435\u043d\u0438\u0435 \u0441 Web&#8217;\u043e\u043c, \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446 \u0438 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0441 \u044d\u0442\u0438\u043c\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430\u043c\u0438.<\/p>\n<\/li>\n<li>\n<p>\u0411\u0440\u0430\u0443\u0437\u0435\u0440 \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437: \u0434\u0432\u0438\u0436\u043a\u0430 (<strong>Engine<\/strong>), \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 (<strong>UI<\/strong>), \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 (<strong>Data<\/strong>), \u0434\u0432\u0438\u0436\u043a\u0430 JavaScript (<strong>Interpreter<\/strong>), \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c\u0430 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 (<strong>Render<\/strong>), \u0441\u0435\u0442\u0435\u0432\u044b\u0445 \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u043e\u0432 (<strong>Networking<\/strong>).<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430 \u0440\u0430\u0437\u043d\u044b\u0445 (\u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u043c\u044b\u0445) \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430\u0445 \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u043e:<\/p>\n<ul>\n<li>\n<p>\u041e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 UI \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 (\u0438\u0445 \u043d\u0430\u043b\u0438\u0447\u0438\u0435, \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0435 \u0434\u0438\u0437\u0430\u0439\u043d\u0443).<\/p>\n<\/li>\n<li>\n<p>\u0420\u0430\u0431\u043e\u0442\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u0438 (\u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0430 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432, \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432, \u043d\u043e\u0442\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438).<\/p>\n<\/li>\n<li>\n<p>\u0412\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 (\u0432\u0438\u0434\u0435\u043e, \u0430\u0443\u0434\u0438\u043e, \u044d\u043b\u0435\u043a\u0442\u0440\u043e\u043d\u043d\u044b\u0435 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u044b).<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p>\u0414\u043b\u044f \u043a\u0440\u043e\u0441\u0441-\u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043d\u043e\u0433\u043e \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u043c\u043e\u0433\u0443\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0442\u0430\u043a\u0438\u0435 \u0441\u0435\u0440\u0432\u0438\u0441\u044b \u043a\u0430\u043a\u00a0<a href=\"https:\/\/crossbrowsertesting.com\/\">SMARTBEAR CrossBrowserTesting<\/a>\u00a0\u0438\u043b\u0438\u00a0<a href=\"https:\/\/www.browserstack.com\/\">BrowserStack<\/a>, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0442 \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0448\u0438\u0440\u043e\u043a\u043e\u043c\u0443 \u0441\u043f\u0435\u043a\u0442\u0440\u0443 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0432\u0438\u0434\u043e\u0432 \u0438 \u0432\u0435\u0440\u0441\u0438\u0439 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041a\u0435\u0439\u0441 \u0441 \u0440\u0435\u0430\u043b\u044c\u043d\u044b\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u043e\u043c \u2014 \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0437\u0432\u0443\u043a\u043e\u0432 \u0432 Chrome \u0438 Safari:<\/summary>\n<div class=\"spoiler__content\">\n<p><em>\u0412 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435 \u0435\u0441\u0442\u044c \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 \u0441\u043e\u0431\u044b\u0442\u0438\u044f, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0437\u0430\u0432\u044f\u0437\u0430\u043d\u0430 \u0440\u0430\u0431\u043e\u0442\u0430 \u0447\u0430\u0441\u0442\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u0430. \u041e\u0434\u043d\u043e \u0438\u0437 \u0442\u0430\u043a\u0438\u0445 \u0441\u043e\u0431\u044b\u0442\u0438\u0439 \u2014 &#171;onClick&#187;: \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u00ab\u0441\u043b\u0443\u0448\u0430\u0435\u0442\u00bb, \u043a\u043e\u0433\u0434\u0430 \u043f\u0440\u043e\u0438\u0437\u043e\u0439\u0434\u0451\u0442 \u043a\u043b\u0438\u043a \u043c\u044b\u0448\u043a\u043e\u0439. \u041d\u0430 \u044d\u0442\u043e \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u0431\u044b\u043b\u043e \u0437\u0430\u0432\u044f\u0437\u0430\u043d\u043e \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0437\u0432\u0443\u043a\u043e\u0432, \u0438, \u043a\u043e\u0433\u0434\u0430 \u043a\u043b\u0438\u043a \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u043b, \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0437\u0430\u043f\u043e\u043c\u0438\u043d\u0430\u043b, \u0447\u0442\u043e \u043d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u0438\u0433\u0440\u0430\u0442\u044c \u0437\u0432\u0443\u043a \u0432 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442. \u041e\u0434\u043d\u0430\u043a\u043e \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435 Safari \u044d\u0442\u043e\u0442 \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c \u0440\u0430\u0431\u043e\u0442\u0430\u043b \u0438\u043d\u0430\u0447\u0435 \u0447\u0435\u043c \u0432 Google Chrome \u2014 \u0435\u0441\u043b\u0438 \u043e\u0431\u043d\u043e\u0432\u0438\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443, \u0442\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u00ab\u0437\u0430\u0431\u044b\u0432\u0430\u043b\u00bb \u043e \u0442\u043e\u043c, \u0447\u0442\u043e \u0441\u043e\u0431\u044b\u0442\u0438\u0435 &#171;onClick&#187; \u0443\u0436\u0435 \u0431\u044b\u043b\u043e \u0438 \u0437\u0432\u0443\u043a \u0432 \u043d\u0443\u0436\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u043d\u0435 \u043f\u0440\u043e\u0438\u0433\u0440\u044b\u0432\u0430\u043b\u0441\u044f.<\/em><\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u043e\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c Web \u043d\u0430 \u0435\u0449\u0451 \u043d\u0435 \u0440\u0435\u043b\u0438\u0437\u043d\u044b\u0445 \u0432\u0435\u0440\u0441\u0438\u044f\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432 (\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: Chrome Beta, Chrome Dev, Chrome Canary).<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u043e\u0434\u043e\u043b\u0436\u0430\u044f \u0440\u0430\u0437\u0433\u043e\u0432\u043e\u0440 \u043e \u0440\u0430\u0437\u043d\u044b\u0445 \u0432\u0435\u0440\u0441\u0438\u044f\u0445, \u0441\u0442\u043e\u0438\u0442 \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c, \u0447\u0442\u043e \u0435\u0441\u0442\u044c \u0440\u0430\u0437\u043b\u0438\u0447\u0438\u044f \u043c\u0435\u0436\u0434\u0443 \u0441\u0442\u0430\u0440\u044b\u043c\u0438 \u0438 \u043d\u043e\u0432\u044b\u043c\u0438 \u0432\u0435\u0440\u0441\u0438\u044f\u043c. \u0414\u0435\u0444\u0435\u043a\u0442\u044b \u0432 \u0441\u0442\u0430\u0440\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 \u0438\u043b\u0438 \u043a\u0440\u0438\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0432 \u043d\u043e\u0432\u043e\u0439 \u043c\u043e\u0433\u0443\u0442 \u043f\u043e\u0432\u043b\u0438\u044f\u0442\u044c \u043d\u0430 \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u0443\u044e \u0440\u0430\u0431\u043e\u0442\u0443 Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, 100-\u044b\u0439 \u043d\u043e\u043c\u0435\u0440 \u0432\u0435\u0440\u0441\u0438\u0438 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u043e\u0433 \u043d\u0435\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u0438\u043d\u0442\u0435\u0440\u043f\u0440\u0435\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u0430\u0439\u0442\u044b).<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary> Change Log \u0438 Release Notes \u0440\u0430\u0437\u043d\u044b\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432:<\/summary>\n<div class=\"spoiler__content\">\n<p>\u0417\u0434\u0435\u0441\u044c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u044b \u0441\u0441\u044b\u043b\u043a\u0438 \u043d\u0430 \u0441\u043f\u0438\u0441\u043a\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u0432\u0435\u0440\u0441\u0438\u0439 \u043d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432, \u0432 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0432\u0441\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043e\u0442 \u0432\u0435\u0440\u0441\u0438\u0438 \u043a \u0432\u0435\u0440\u0441\u0438\u0438:<\/p>\n<p>Chrome:\u00a0<a href=\"https:\/\/chromium.googlesource.com\/chromium\/src\/\">https:\/\/chromium.googlesource.com\/chromium\/src<\/a><\/p>\n<p>Firefox:\u00a0<a href=\"https:\/\/www.mozilla.org\/en-US\/firefox\/releases\/\">https:\/\/www.mozilla.org\/en-US\/firefox\/releases<\/a><\/p>\n<p>Opera:\u00a0<a href=\"https:\/\/blogs.opera.com\/desktop\/changelog-for-86\/\">https:\/\/blogs.opera.com\/desktop\/changelog-for-86<\/a><\/p>\n<p>Safari:\u00a0<a href=\"https:\/\/developer.apple.com\/documentation\/safari-release-notes\">https:\/\/developer.apple.com\/documentation\/safari-release-notes<\/a><\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0418 \u0432 \u0434\u043e\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u0435 \u0442\u0435\u043c\u0430\u0442\u0438\u043a\u0438 \u0440\u0430\u0437\u043d\u043e\u0432\u0438\u0434\u043d\u043e\u0441\u0442\u0435\u0439 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432 \u0445\u043e\u0442\u0435\u043b\u043e\u0441\u044c \u0431\u044b \u043e\u0442\u043c\u0435\u0442\u0438\u0442\u044c \u0442\u0430\u043a\u043e\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u043a\u0430\u043a &#171;Geo-Specific&#187;. \u0418\u043d\u044b\u043c\u0438 \u0441\u043b\u043e\u0432\u0430\u043c\u0438, \u0432\u0435\u0440\u0441\u0438\u0438 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432, \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u0447\u043d\u044b\u0435 \u0434\u043b\u044f \u043a\u0430\u043a\u043e\u0433\u043e-\u0442\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u043e\u0433\u043e \u0433\u0435\u043e\/\u0441\u0442\u0440\u0430\u043d\u044b\/\u0440\u0435\u0433\u0438\u043e\u043d\u0430 (\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;Coc Coc&#187; \u0434\u043b\u044f \u0412\u044c\u0435\u0442\u043d\u0430\u043c\u0430).<\/p>\n<\/li>\n<\/ul>\n<ul>\n<li>\n<p>\u0412 \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0438\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u0441\u0430\u043c\u044b\u0439 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u043c \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u043c \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f Google Chrome, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u0434\u0432\u0438\u0436\u043e\u043a Blink (\u044d\u0442\u043e\u0442 \u0434\u0432\u0438\u0436\u043e\u043a \u0442\u0430\u043a\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432 Opera, Microsoft Edge).<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u0421\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0430 \u043f\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430\u043c \u043d\u0430 2021 \u0433\u043e\u0434 (\u041f\u043e \u0432\u0435\u0440\u0441\u0438\u0438 Affde):<\/summary>\n<div class=\"spoiler__content\">\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/28b\/2e4\/be4\/28b2e4be450745f17c86040936db82ec.png\" width=\"2500\" height=\"1900\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/28b\/2e4\/be4\/28b2e4be450745f17c86040936db82ec.png\"\/><figcaption><\/figcaption><\/figure>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/bf9\/910\/a3f\/bf9910a3f04400273c26e334cf54beae.png\" width=\"2500\" height=\"1900\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/bf9\/910\/a3f\/bf9910a3f04400273c26e334cf54beae.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<hr\/>\n<p><a class=\"anchor\" name=\"verstka\" id=\"verstka\"><\/a><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td data-colwidth=\"252\" width=\"252\">\n<p align=\"left\"><strong>\u041e\u0431\u043b\u0430\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u042d\u043a\u0440\u0430\u043d (\u041e\u043a\u043d\u043e)<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"252\" width=\"252\">\n<p align=\"left\"><strong>\u041a\u043b\u0430\u0441\u0441<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0412\u0451\u0440\u0441\u0442\u043a\u0430<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"252\" width=\"252\">\n<p align=\"left\"><strong>\u041e\u0431\u044a\u0435\u043a\u0442\u044b<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212; \u0420\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0435<br \/>&#8212; \u0421\u043e\u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u0435 \u0441\u0442\u043e\u0440\u043e\u043d<br \/>&#8212; \u041e\u0440\u0438\u0435\u043d\u0442\u0430\u0446\u0438\u044f<br \/>&#8212; \u0421\u0442\u0440\u0430\u043d\u0438\u0446\u0430<br \/>&#8212; \u041c\u0430\u0441\u0448\u0442\u0430\u0431<br \/>&#8212; \u0410\u0434\u0430\u043f\u0442\u0430\u0446\u0438\u044f<br \/>&#8212; \u042d\u043b\u0435\u043c\u0435\u043d\u0442\u044b<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<ul>\n<li>\n<p>\u0412\u0451\u0440\u0441\u0442\u043a\u0430 Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b (<strong>Layout<\/strong>) \u2014 \u044d\u0442\u043e \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430 \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 HTML-\u0440\u0430\u0437\u043c\u0435\u0442\u043a\u0438 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c CSS-\u0441\u0442\u0438\u043b\u0435\u0439.<\/p>\n<\/li>\n<li>\n<p>\u0421\u0430\u043c\u0430 \u043f\u043e \u0441\u0435\u0431\u0435 Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430, \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u0435\u0441\u043b\u0438 \u044d\u0442\u043e Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0438\u0437 \u0441\u0435\u0431\u044f UI, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0434\u043e\u043b\u0436\u0435\u043d \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u043d\u0435\u043a\u0438\u043c UX \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u0430\u043c:<\/p>\n<ul>\n<li>\n<p>UI (<strong>User Interface<\/strong>) \u2014 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u043a\u0430\u043a \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u0439.<\/p>\n<\/li>\n<li>\n<p>UX (<strong>User Experience<\/strong>) \u2014 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u043e\u043f\u044b\u0442 \u043a\u0430\u043a \u043e\u0436\u0438\u0434\u0430\u043d\u0438\u044f \u0434\u043b\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u0439.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p>\u0414\u043b\u044f UI \u0447\u0430\u0441\u0442\u0438 Web&#8217;\u0430, \u043a\u0430\u043a \u043f\u0440\u0430\u0432\u0438\u043b\u043e, \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0434\u0438\u0437\u0430\u0439\u043d-\u043c\u0430\u043a\u0435\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043a\u0438 \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e UI \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435:<\/p>\n<ul>\n<li>\n<p>\u0440\u0430\u0437\u043c\u0435\u0440\u044b \u0432 \u043f\u0438\u043a\u0441\u0435\u043b\u044f\u0445<\/p>\n<\/li>\n<li>\n<p>\u0444\u043e\u0440\u043c\u0443<\/p>\n<\/li>\n<li>\n<p>\u0446\u0432\u0435\u0442<\/p>\n<\/li>\n<li>\n<p>\u043e\u0442\u0441\u0442\u0443\u043f\u044b \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0434\u0440\u0443\u0433\u0438\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0438 \u0434\u0440.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<ul>\n<li>\n<p>\u041f\u043e\u043c\u0438\u043c\u043e \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432, \u043d\u0430 \u043c\u0430\u043a\u0435\u0442\u0435 \u043e\u0442\u0440\u0430\u0436\u0435\u043d\u043e \u0438 \u0438\u0445 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044f \u043f\u043e\u043b\u043d\u0443\u044e \u043a\u043e\u043c\u043f\u043e\u0437\u0438\u0446\u0438\u044e.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u0414\u0438\u0437\u0430\u0439\u043d \u0442\u0430\u043a\u0436\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0443\u0441\u043b\u043e\u0432\u0438\u044f \u0434\u043b\u044f \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u0433\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0432\u0451\u0440\u0441\u0442\u043a\u0438:<\/summary>\n<div class=\"spoiler__content\">\n<ul>\n<li>\n<p>\u0434\u043e\u043f\u0443\u0441\u0442\u0438\u043c\u043e\u0435 \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u044d\u043a\u0440\u0430\u043d\u0430 \u0438 \u0441\u043e\u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u0435 \u0441\u0442\u043e\u0440\u043e\u043d<\/p>\n<\/li>\n<li>\n<p>\u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0430\u0434\u0430\u043f\u0442\u0430\u0446\u0438\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/p>\n<\/li>\n<li>\n<p>\u0433\u0440\u0430\u043d\u0438\u0446\u044b, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043d\u0430 \u0430\u0434\u0430\u043f\u0442\u0438\u0432\u043d\u044b\u0439 \u0434\u0438\u0437\u0430\u0439\u043d (\u0442\u043e\u0447\u043a\u0438 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0430)<\/p>\n<\/li>\n<li>\n<p>\u043d\u0430\u043b\u0438\u0447\u0438\u0435 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/p>\n<\/li>\n<li>\n<p>\u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432<\/p>\n<\/li>\n<li>\n<p>\u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u043c\u044b\u0439 \u043c\u0430\u0441\u0448\u0442\u0430\u0431 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u041e\u0441\u043d\u043e\u0432\u044b\u0432\u0430\u044f\u0441\u044c \u043d\u0430 \u0442\u0430\u043a\u043e\u043c \u043c\u0430\u043a\u0435\u0442\u0435, \u0432 \u0442\u043e\u0439 \u0438\u043b\u0438 \u0438\u043d\u043e\u0439 \u043c\u0435\u0440\u0435 \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u043e\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u0451\u0440\u0441\u0442\u043a\u0443 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0438 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0435 UI \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0430 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0435 \u0438\u0445 \u0434\u0438\u0437\u0430\u0439\u043d\u0443 \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u0442\u0435\u0441\u0442\u043e\u0432\u044b\u0445 \u0441\u0440\u0435\u0434\u0430\u0445 \u0438 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u044f\u0445.<\/p>\n<\/li>\n<li>\n<p>\u0414\u043b\u044f \u044d\u043c\u0443\u043b\u044f\u0446\u0438\u0438 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0439, \u0441\u043e\u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u0439 \u0441\u0442\u043e\u0440\u043e\u043d \u0438 \u043f\u0440\u043e\u0447\u0435\u0433\u043e \u043d\u0430 \u041f\u041a \u0432 DevTools \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 &#171;Toggle Device Toolbar&#187;.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 &#171;Device Toolbar&#187; \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b:<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c DevTools \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 (F12 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e).<\/p>\n<\/li>\n<li>\n<p>\u0412\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043f\u0430\u043d\u0435\u043b\u044c \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430 (&#171;Toggle Device Toolbar&#187;).<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/808\/2b2\/38c\/8082b238c0dd9fbdff7a8c43c1235e89.png\" width=\"146\" height=\"54\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/808\/2b2\/38c\/8082b238c0dd9fbdff7a8c43c1235e89.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u0412 \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0435\u043c \u0441\u043f\u0438\u0441\u043a\u0435 &#171;Dimensions&#187; \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u043f\u0440\u0435\u0441\u0435\u0442 \u0441 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u043c \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0430 \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0435\u043c.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/e07\/a40\/9f8\/e07a409f8c3ed8f21cb08d55b5ed7df3.png\" width=\"537\" height=\"30\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/e07\/a40\/9f8\/e07a409f8c3ed8f21cb08d55b5ed7df3.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"4\">\n<li>\n<p>\u0420\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u043c\u043e\u0436\u043d\u043e \u0432\u044b\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0438 \u0432 \u0440\u0443\u0447\u043d\u0443\u044e, \u043a\u0430\u043a\u043e\u0435 \u0443\u0433\u043e\u0434\u043d\u043e (\u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e &#171;Dimensions&#187; \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u0432 \u0440\u0435\u0436\u0438\u043c &#171;Responsive&#187;).<\/p>\n<\/li>\n<li>\n<p>\u0427\u0442\u043e\u0431\u044b \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c Web \u043d\u0430 \u0430\u0434\u0430\u043f\u0442\u0438\u0432, \u0432 \u0440\u0435\u0436\u0438\u043c\u0435 &#171;Responsive&#187; \u043c\u043e\u0436\u043d\u043e \u0441\u0434\u0432\u0438\u0433\u0430\u0442\u044c \u0441\u0442\u043e\u0440\u043e\u043d\u044b \u044d\u043c\u0443\u043b\u0438\u0440\u0443\u0435\u043c\u043e\u0433\u043e \u044d\u043a\u0440\u0430\u043d\u0430. \u041d\u043e \u043e\u0431\u044b\u0447\u043d\u043e \u044d\u0442\u043e\u0433\u043e \u043d\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f, \u043a\u043e\u0433\u0434\u0430 \u0442\u043e\u0447\u043d\u043e \u0438\u0437\u0432\u0435\u0441\u0442\u043d\u044b \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u043c\u044b\u0435 \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u044f \u0434\u043b\u044f Web&#8217;\u0430.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/52c\/675\/b9c\/52c675b9ca2e68f55bf3edcebe392132.png\" width=\"350\" height=\"198\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/52c\/675\/b9c\/52c675b9ca2e68f55bf3edcebe392132.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"6\">\n<li>\n<p>\u041e\u0440\u0438\u0435\u043d\u0442\u0430\u0446\u0438\u044f \u0438\u0437 &#171;\u043a\u043d\u0438\u0436\u043d\u043e\u0439&#187; \u0432 &#171;\u0430\u043b\u044c\u0431\u043e\u043c\u043d\u0443\u044e&#187; \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043a\u043d\u043e\u043f\u043a\u0438 &#171;Rotate&#187;.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/965\/a77\/605\/965a776057e1bb15a07b454896319607.png\" width=\"73\" height=\"50\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/965\/a77\/605\/965a776057e1bb15a07b454896319607.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"7\">\n<li>\n<p>\u0418\u0437 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0432 \u044d\u0442\u043e\u043c \u043e\u043a\u043d\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u0435\u0449\u0451 \u043f\u0440\u0438\u0433\u043e\u0434\u0438\u0442\u044c\u0441\u044f:<\/p>\n<\/li>\n<\/ol>\n<ul>\n<li>\n<p>Show rulers (\u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u043b\u0438\u043d\u0435\u0439\u043a\u0443 \u0434\u043b\u044f \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u044f \u043e\u043a\u043d\u0430)<\/p>\n<\/li>\n<li>\n<p>Show media queries (\u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 CSS \u043c\u0435\u0434\u0438\u0430-\u0437\u0430\u043f\u0440\u043e\u0441\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u044e\u0442 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0441\u0442\u0438\u043b\u0435\u0439 \u0434\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0441 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u043c \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0435\u043c \u043e\u043a\u043d\u0430)<\/p>\n<\/li>\n<li>\n<p>Capture screenshot (Capture full size screenshot) (\u0421\u0434\u0435\u043b\u0430\u0442\u044c \u0441\u043a\u0440\u0438\u043d\u0448\u043e\u0442 Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0432 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u043e\u043c \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0438 \u043e\u043a\u043d\u0430)<\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u041c\u0435\u043d\u044f\u0442\u044c \u043c\u0430\u0441\u0448\u0442\u0430\u0431 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043c\u043e\u0436\u043d\u043e \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0442\u0430\u043a \u0436\u0435 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u043e\u0433\u043e \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0430 (\u0432 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u0445 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0438\u043b\u0438 \u043f\u043e \u0433\u043e\u0440\u044f\u0447\u0438\u043c \u043a\u043b\u0430\u0432\u0438\u0448\u0430\u043c):<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/692\/0f5\/372\/6920f53726c504ffdf020779b3063c17.png\" width=\"438\" height=\"33\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/692\/0f5\/372\/6920f53726c504ffdf020779b3063c17.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0414\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u0443\u0437\u043d\u0430\u0442\u044c \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043a\u0438 (\u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b) \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 (\u0435\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u044b, HEX-\u043a\u043e\u0434 \u0446\u0432\u0435\u0442\u0430 \u0438 \u043f\u0440.), \u0432\u043d\u043e\u0432\u044c \u043f\u043e\u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u043e\u0431\u0440\u0430\u0442\u0438\u0442\u044c\u0441\u044f \u043a DevTools.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u0418\u043d\u0441\u043f\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e DevTools:<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c DevTools \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 (F12 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e).<\/p>\n<\/li>\n<li>\n<p>\u0412\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u0440\u0435\u0436\u0438\u043c \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f (&#171;Select an element in the page to inspect it&#187;).<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/3cc\/b2e\/ec4\/3ccb2eec49ddf1e408314d862f1fc325.png\" width=\"294\" height=\"116\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/3cc\/b2e\/ec4\/3ccb2eec49ddf1e408314d862f1fc325.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u041d\u0430\u0432\u0435\u0441\u0442\u0438 \u043a\u0443\u0440\u0441\u043e\u0440 \u043d\u0430 \u0442\u0440\u0435\u0431\u0443\u0435\u043c\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 (\u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u0438 \u0435\u0433\u043e \u0433\u0440\u0430\u043d\u0438\u0446\u044b \u0434\u043e\u043b\u0436\u043d\u044b \u043f\u043e\u0434\u0441\u0432\u0435\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0434\u043e\u043b\u0436\u0435\u043d \u043e\u0442\u043a\u0440\u044b\u0442\u044c\u0441\u044f \u0442\u0443\u043b\u0442\u0438\u043f \u0441 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u0430\u043c\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430).<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/8b0\/67f\/9cb\/8b067f9cbff39bceae733bd6b8d4091a.png\" width=\"910\" height=\"426\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/8b0\/67f\/9cb\/8b067f9cbff39bceae733bd6b8d4091a.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"4\">\n<li>\n<p>\u041a\u043b\u0438\u043a\u043d\u0443\u0442\u044c \u043f\u043e \u0432\u044b\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u043c\u0443 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0443, \u0434\u043b\u044f \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u044f \u0435\u0433\u043e \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u043e\u0432 \u0432 DevTools.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/ea8\/96e\/889\/ea896e8891f8d7330db81b6b685ba8ed.png\" width=\"1364\" height=\"130\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ea8\/96e\/889\/ea896e8891f8d7330db81b6b685ba8ed.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"5\">\n<li>\n<p>\u041d\u0430 \u0441\u043e\u0441\u0435\u0434\u043d\u0435\u0439 \u0432\u043a\u043b\u0430\u0434\u043a\u0435 \u0431\u0443\u0434\u0435\u0442 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u043e CSS-\u0441\u0442\u0438\u043b\u044f\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/8bb\/23d\/28d\/8bb23d28daf2f95f4ad998637c2751c0.png\" width=\"1464\" height=\"716\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/8bb\/23d\/28d\/8bb23d28daf2f95f4ad998637c2751c0.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"6\">\n<li>\n<p>\u0415\u0441\u043b\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u044c \u0432\u043a\u043b\u0430\u0434\u043a\u0443 \u0441 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u0431\u0435\u0437 \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f, \u0442\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0430 \u0432 \u0432\u0438\u0434\u0435 HTML-\u0440\u0430\u0437\u043c\u0435\u0442\u043a\u0438, \u0438 \u043c\u043e\u0436\u0435\u0442 \u0438\u043c\u0435\u0442\u044c \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u0443\u044e \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0443.<br \/>\u041f\u0440\u0438 \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0437\u0432\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f:<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/62f\/824\/18f\/62f82418f051b60729325d43e85fcafb.png\" width=\"1206\" height=\"632\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/62f\/824\/18f\/62f82418f051b60729325d43e85fcafb.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"7\">\n<li>\n<p>\u0412\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0435 &#171;Elements&#187; \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u0431\u043b\u044e\u0434\u0430\u0442\u044c, \u043a\u0430\u043a \u043c\u0435\u043d\u044f\u044e\u0442\u0441\u044f \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043f\u0440\u0438 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0438 \u0441 \u043d\u0438\u043c.<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0435 &#171;Elements&#187; \u043c\u043e\u0436\u043d\u043e \u0440\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b \u043b\u044e\u0431\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0434\u043b\u044f \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043f\u0440\u043e\u0432\u0435\u0440\u043e\u043a.<\/p>\n<\/li>\n<\/ol>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p><strong>\u0410 \u0432\u044b \u0437\u043d\u0430\u043b\u0438?<\/strong><\/p>\n<p>\u0415\u0441\u043b\u0438 \u0432\u043f\u0438\u0441\u0430\u0442\u044c \u0432 DevTools \u043a\u043e\u043d\u0441\u043e\u043b\u044c \u043a\u043e\u043c\u0430\u043d\u0434\u0443 &#171;<code>document.body.contentEditable = true\" (\u0431\u0435\u0437 \u043a\u0430\u0432\u044b\u0447\u0435\u043a),\u00a0<\/code>\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0440\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043b\u044e\u0431\u043e\u0439 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0434\u043e \u0435\u0451 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f.<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/details>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\"><strong>\u041d\u0430\u0437\u044b\u0432\u0430\u0439 UI \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e!<\/strong><\/p>\n<p align=\"left\">\u0414\u043b\u044f \u043e\u0431\u043b\u0435\u0433\u0447\u0435\u043d\u0438\u044f \u043a\u043e\u043c\u043c\u0443\u043d\u0438\u043a\u0430\u0446\u0438\u0438 \u043c\u0435\u0436\u0434\u0443 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430\u043c\u0438 \u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430\u043c\u0438, \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0449\u0438\u043a\u0443 \u0432\u0430\u0436\u043d\u043e \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u0443\u044e \u044d\u0442\u0438\u043a\u0443 \u0438 \u043d\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u0432\u0435\u0449\u0438 \u0441\u0432\u043e\u0438\u043c\u0438 \u0438\u043c\u0435\u043d\u0430\u043c\u0438.<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<details class=\"spoiler\">\n<summary>\u041e\u0431\u0449\u0435\u043f\u0440\u0438\u043d\u044f\u0442\u044b\u0435 \u043d\u0430\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u0438\u044f UI \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0434\u043b\u044f Web&#8217;\u0430:<\/summary>\n<div class=\"spoiler__content\">\n<ul>\n<li>\n<p>\u0421\u0442\u0440\u0430\u043d\u0438\u0446\u0430 (<strong>Page<\/strong>) \u2014 \u043e\u0431\u0449\u0438\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442-\u043e\u0431\u044a\u0435\u043a\u0442, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0431\u0430\u0437\u0438\u0440\u0443\u044e\u0442\u0441\u044f \u0432\u0441\u0435 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435.<\/p>\n<\/li>\n<li>\n<p>\u041a\u043e\u043d\u0442\u0435\u043d\u0442 (<strong>Content<\/strong>) \u2014 \u043d\u0430\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0442\u0435\u043a\u0441\u0442\u043e\u043c, \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f\u043c\u0438, \u043f\u0440\u043e\u0447\u0438\u043c\u0438 \u043c\u0443\u043b\u044c\u0442\u0438\u043c\u0435\u0434\u0438\u0430 \u0440\u0435\u0441\u0443\u0440\u0441\u0430\u043c\u0438.<\/p>\n<\/li>\n<li>\n<p>\u0428\u0430\u043f\u043a\u0430 (<strong>Header<\/strong>) \u2014 \u0441\u0430\u043c\u0430\u044f \u0432\u0435\u0440\u0445\u043d\u044f\u044f \u0447\u0430\u0441\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u0434\u0432\u0430\u043b (<strong>Footer<\/strong>) \u2014 \u0441\u0430\u043c\u0430\u044f \u043d\u0438\u0436\u043d\u044f\u044f \u0447\u0430\u0441\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u043b\u0435 \u0432\u0432\u043e\u0434\u0430\/\u041f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0432\u0432\u043e\u0434 (<strong>Input Field\/User Input<\/strong>) \u2014 \u0442\u0442\u0435\u043a\u0441\u0442\u043e\u0432\u043e\u0435 \u0438\u043b\u0438 \u0447\u0438\u0441\u043b\u043e\u0432\u043e\u0435 \u043f\u043e\u043b\u0435, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043c\u043e\u0436\u043d\u043e \u0432\u0432\u0435\u0441\u0442\u0438 \u0434\u0430\u043d\u043d\u044b\u0435 \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0441 \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u044b.<\/p>\n<\/li>\n<li>\n<p>\u041a\u043d\u043e\u043f\u043a\u0430 (<strong>Button<\/strong>) \u2014 \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u043a\u043d\u043e\u043f\u043a\u0430 \u0434\u043b\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e\u043c UI.<\/p>\n<\/li>\n<li>\n<p>\u0420\u0430\u0434\u0438\u043e-\u043a\u043d\u043e\u043f\u043a\u0430 (<strong>Radio button<\/strong>) \u2014 \u043a\u043d\u043e\u043f\u043a\u0430-\u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u0442\u0435\u043b\u044c, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u0438\u043d \u043f\u0443\u043d\u043a\u0442 \u0438\u0437 \u0441\u043f\u0438\u0441\u043a\u0430.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/f4b\/047\/90b\/f4b04790bf1535439ce3e2b661758d7b.png\" width=\"1414\" height=\"72\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/f4b\/047\/90b\/f4b04790bf1535439ce3e2b661758d7b.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0424\u043b\u0430\u0436\u043a\u0438 (<strong>Flag<\/strong>) \u2014 UI \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0438\u043c\u0435\u044e\u0442 \u0434\u0432\u0430 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f: \u0432\u043a\u043b\u044e\u0447\u0451\u043d\/\u0432\u044b\u043a\u043b\u044e\u0447\u0435\u043d:<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/505\/bc8\/a6f\/505bc8a6f7f5631f34be94ba1d471eb5.png\" width=\"506\" height=\"138\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/505\/bc8\/a6f\/505bc8a6f7f5631f34be94ba1d471eb5.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u2013 \u0427\u0435\u043a-\u0431\u043e\u043a\u0441 (<strong>Checkbox<\/strong>) \u2014 \u043f\u043e\u043b\u0435 \u0441 \u043e\u0442\u043c\u0435\u0442\u043a\u043e\u0439.<br \/>\u2013 \u041f\u043e\u043b\u0437\u0443\u043d\u043e\u043a (<strong>Slider<\/strong>) \u2014 \u0441\u043a\u043e\u043b\u044c\u0437\u044f\u0449\u0430\u044f \u043a\u043d\u043e\u043f\u043a\u0430, \u043c\u043e\u0436\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0434\u043b\u044f \u043f\u043e\u0434\u0447\u0451\u0440\u043a\u0438\u0432\u0430\u043d\u0438\u044f \u0432\u044b\u0431\u043e\u0440\u0430.<br \/>\u2013 \u041f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u0442\u0435\u043b\u044c (<strong>Toggle<\/strong>) \u2014 \u00ab\u0440\u0443\u0431\u0438\u043b\u044c\u043d\u0438\u043a\u00bb.<\/p>\n<ul>\n<li>\n<p>\u0412\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0438\u0439 \u0441\u043f\u0438\u0441\u043e\u043a (<strong>Dropdown<\/strong>) \u2014 \u043f\u043e\u043b\u0435 \u0441 \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0438\u043c \u0441\u043f\u0438\u0441\u043a\u043e\u043c \u0434\u043b\u044f \u0432\u044b\u0431\u043e\u0440\u0430.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/ad7\/b2c\/b12\/ad7b2cb127ad7c3cd1517535b5e137d1.png\" width=\"224\" height=\"210\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ad7\/b2c\/b12\/ad7b2cb127ad7c3cd1517535b5e137d1.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u041f\u0438\u043a\u0435\u0440 (<strong>Picker\/Datepicker\/Timepicker<\/strong>) \u2014 \u043c\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0439 \u0432\u044b\u0431\u043e\u0440 \u0434\u0430\u0442\u044b\/\u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u0432 \u043a\u0430\u043b\u0435\u043d\u0434\u0430\u0440\u044f\u0445 \u0438 \u043f\u0440\u043e\u0447\u0438\u0445 \u043f\u043e\u0434\u043e\u0431\u043d\u044b\u0445 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u044f\u0445.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0430 (<strong>Tooltip<\/strong>) \u2014 \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u0440\u0438 \u043d\u0430\u0432\u0435\u0434\u0435\u043d\u0438\u0438 \u043a\u0443\u0440\u0441\u043e\u0440\u0430 (hover) \u043d\u0430 UI \u044d\u043b\u0435\u043c\u0435\u043d\u0442.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/5a4\/f52\/bf5\/5a4f52bf505ed968293c698c05f66d45.png\" width=\"614\" height=\"104\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/5a4\/f52\/bf5\/5a4f52bf505ed968293c698c05f66d45.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u041f\u0430\u0433\u0438\u043d\u0430\u0446\u0438\u044f (<strong>Pagination<\/strong>) \u2014 \u043d\u0443\u043c\u0435\u0440\u0430\u0446\u0438\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\/\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432, \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u0451\u043d\u043d\u044b\u0445 \u043e\u0434\u043d\u0438\u043c \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e\u043c (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043e\u0442\u0447\u0451\u0442\u0430).<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/66e\/c3b\/741\/66ec3b7413d84088ae664114c781fd5d.png\" width=\"490\" height=\"116\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/66e\/c3b\/741\/66ec3b7413d84088ae664114c781fd5d.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0418\u043a\u043e\u043d\u043a\u0430 (<strong>Icon<\/strong>) \u2014 \u043f\u0438\u043a\u0442\u043e\u0433\u0440\u0430\u043c\u043c\u0430, \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0435 \u0434\u043b\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u0439 \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u0438. \u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u043a\u043e\u043d\u043e\u043a \u043c\u0435\u043d\u044e \u0434\u043b\u044f \u0441\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u043a\u0438 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430\/\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0438\u043b\u0438 \u0434\u043b\u044f \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u044f \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u043d\u044b\u0445 \u043c\u0435\u043d\u044e:<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/480\/d5f\/4ce\/480d5f4cea8947bf13301646ca625a3f.png\" width=\"932\" height=\"706\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/480\/d5f\/4ce\/480d5f4cea8947bf13301646ca625a3f.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u041c\u043e\u0434\u0430\u043b\u044c\u043d\u043e\u0435 \u043e\u043a\u043d\u043e (<strong>Modal<\/strong>) \u2014 \u043e\u043a\u043d\u043e, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u00ab\u043f\u043e\u0432\u0435\u0440\u0445\u00bb \u0432\u0441\u0435\u0439 \u0441\u0442\u0430\u043d\u0438\u0446\u044b \u0438 \u0431\u043b\u043e\u043a\u0438\u0440\u0443\u0435\u0442 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u043d\u0435\u0439.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u043f-\u0430\u043f (<strong>Popup<\/strong>) \u2014 \u0432\u0441\u043f\u043b\u044b\u0432\u0430\u044e\u0449\u0435\u0435 \u043e\u043a\u043d\u043e, \u0441\u0445\u043e\u0436\u0435 \u0441 \u0442\u0443\u043b\u0442\u0438\u043f\u043e\u043c, \u043d\u043e \u0441 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c\u044e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 \u043d\u0438\u043c (\u043f\u043e \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0438 \u0441 \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u044b\u043c \u043e\u043a\u043d\u043e\u043c).<\/p>\n<\/li>\n<li>\n<p>\u0424\u043e\u0440\u043c\u0430 (<strong>Form<\/strong>) \u2014 \u043f\u043e \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430\u043c \u0441\u0445\u043e\u0436\u0430 \u0441 \u043c\u043e\u0434\u0430\u043b\u044c\u043d\u044b\u043c \u043e\u043a\u043d\u043e\u043c, \u043d\u043e \u0438\u043c\u0435\u0435\u0442 \u0438\u043d\u043e\u0435 \u043f\u0440\u0435\u0434\u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: \u0430\u043d\u043a\u0435\u0442\u0430, \u043e\u0431\u0440\u0430\u0442\u043d\u0430\u044f \u0441\u0432\u044f\u0437\u044c, \u043e\u043f\u043b\u0430\u0442\u0430).<\/p>\n<\/li>\n<li>\n<p>\u00ab\u0425\u043b\u0435\u0431\u043d\u044b\u0435 \u043a\u0440\u043e\u0448\u043a\u0438\u00bb (<strong>Breadcrumb<\/strong>) \u2014 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u0438 \u0432 \u0432\u0438\u0434\u0435 \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442, \u043d\u0430 \u043a\u0430\u043a\u043e\u043c \u0440\u0430\u0437\u0434\u0435\u043b\u0435 \u0441\u0430\u0439\u0442\u0430 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/ac2\/ba5\/18e\/ac2ba518e930298158a7dfd36d372d50.png\" width=\"796\" height=\"82\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ac2\/ba5\/18e\/ac2ba518e930298158a7dfd36d372d50.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0411\u043e\u043a\u043e\u0432\u0430\u044f \u043f\u0430\u043d\u0435\u043b\u044c (<strong>Sidebar<\/strong>).<\/p>\n<\/li>\n<li>\n<p>\u041b\u0435\u043d\u0442\u0430 (<strong>Feed<\/strong>) \u2014 \u0443\u043f\u043e\u0440\u044f\u0434\u043e\u0447\u0435\u043d\u043d\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430, \u043e\u0441\u043d\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u043d\u0430 \u043c\u043e\u0434\u0443\u043b\u044c\u043d\u043e\u0441\u0442\u0438.<\/p>\n<\/li>\n<li>\n<p>\u041a\u0430\u0440\u0443\u0441\u0435\u043b\u044c (<strong>Carousel<\/strong>) \u2014 \u00ab\u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0430\u00bb \u0434\u043b\u044f \u043f\u0440\u043e\u0441\u043c\u043e\u0442\u0440\u0430 \u043d\u0430\u0431\u043e\u0440\u0430 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430.<\/p>\n<\/li>\n<li>\n<p>\u041a\u0430\u0440\u0442\u043e\u0447\u043a\u0430 (<strong>Card<\/strong>) \u2014 \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c, \u043c\u043e\u0436\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c \u0442\u0435\u043a\u0441\u0442, \u043a\u043d\u043e\u043f\u043a\u0438, \u043c\u0443\u043b\u044c\u0442\u0438\u043c\u0435\u0434\u0438\u0430.<\/p>\n<\/li>\n<li>\n<p>\u041b\u043e\u0430\u0434\u0435\u0440 (<strong>Loader<\/strong>) \u2014 \u043a\u0430\u043a \u043f\u0440\u0430\u0432\u0438\u043b\u043e \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0432 \u0432\u0438\u0434\u0435 wait-\u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u0430, \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e \u043e\u0442\u0440\u0430\u0436\u0430\u044e\u0449\u0438\u0439 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0443 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 \u0438\u043b\u0438 \u0438\u043d\u044b\u0445 \u0434\u0430\u043d\u043d\u044b\u0445 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/8ac\/eb4\/62b\/8aceb462b35da308f6eed530268bc902.png\" width=\"152\" height=\"134\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/8ac\/eb4\/62b\/8aceb462b35da308f6eed530268bc902.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0421\u0442\u0440\u043e\u043a\u0430 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 (<strong>Progress bar<\/strong>) \u2014 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0430, \u043f\u0440\u043e\u0445\u043e\u0436\u0434\u0435\u043d\u0438\u044f \u043f\u0440\u043e\u0433\u0440\u0435\u0441\u0441\u0430, \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/0b7\/afd\/78b\/0b7afd78b1e47a7c215333344f8867fa.png\" width=\"1548\" height=\"120\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/0b7\/afd\/78b\/0b7afd78b1e47a7c215333344f8867fa.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0420\u0430\u0437\u0443\u043c\u0435\u0435\u0442\u0441\u044f, \u0437\u0434\u0435\u0441\u044c \u043d\u0435 \u043e\u0442\u0440\u0430\u0436\u0435\u043d\u044b \u0432\u0441\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b UI.<br \/>\u0411\u043e\u043b\u0435\u0435 \u0442\u043e\u0433\u043e, \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u043d\u043e\u0432\u044b\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0442\u0430\u043a \u0438\u043b\u0438 \u0438\u043d\u0430\u0447\u0435 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0432 \u0441\u0442\u0440\u0435\u043c\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0440\u0430\u0437\u0432\u0438\u0432\u0430\u044e\u0449\u0435\u043c\u0441\u044f Web-\u0434\u0438\u0437\u0430\u0439\u043d\u0435, \u043d\u043e\u0432\u044b\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u044f \u043f\u043e UX \u043f\u043e\u0440\u043e\u0436\u0434\u0430\u044e\u0442 \u043d\u043e\u0432\u044b\u0439 UI.<br \/>\u041d\u043e \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u043f\u043e\u0438\u043d\u0442 \u043c\u044b\u0441\u043b\u0438 \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u0443 \u0432\u0441\u0435\u0433\u043e \u0435\u0441\u0442\u044c \u0441\u0432\u043e\u0451 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435.<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0412\u0438\u0434\u044b \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0442\u044c\u0441\u044f:<\/p>\n<ul>\n<li>\n<p>UI\/UX \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 (\u043e\u0431\u044a\u0435\u0434\u0438\u043d\u044f\u0435\u0442 \u0432 \u0441\u0435\u0431\u0435 \u00ab\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0432\u0451\u0440\u0441\u0442\u043a\u0438\u00bb \u0438 &#171;Usability-\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435&#187;)<\/p>\n<\/li>\n<li>\n<p>\u041a\u0440\u043e\u0441\u0441-\u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043d\u043e\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 (\u0432\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u0432 \u0441\u0435\u0431\u044f \u00ab\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u0438\u043c\u043e\u0441\u0442\u0438\u00bb)<\/p>\n<\/li>\n<li>\n<p>\u0422\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u043b\u043e\u043a\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 (\u0442\u0430\u043a\u0436\u0435 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0447\u0430\u0441\u0442\u044c\u044e &#171;UI\/UX \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0422\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0438\u043d\u0442\u0435\u0440\u043d\u0430\u0446\u0438\u043e\u043d\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 (\u0447\u0442\u043e \u0442\u0430\u043a\u0436\u0435 \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u043e\u0432\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0432 \u0440\u0430\u043c\u043a\u0430\u0445 &#171;UI\/UX \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f&#187;)<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<hr\/>\n<p><a class=\"anchor\" name=\"vvod\" id=\"vvod\"><\/a><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td data-colwidth=\"254\" width=\"254\">\n<p align=\"left\"><strong>\u041e\u0431\u043b\u0430\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0412\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"254\" width=\"254\">\n<p align=\"left\"><strong>\u041a\u043b\u0430\u0441\u0441<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0412\u0432\u043e\u0434 (\u0423\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435)<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"254\" width=\"254\">\n<p align=\"left\"><strong>\u041e\u0431\u044a\u0435\u043a\u0442\u044b<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212; \u041a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u0430<br \/>&#8212; \u041c\u044b\u0448\u044c<br \/>&#8212; \u0422\u0430\u0447\u043f\u0430\u0434<br \/>&#8212; \u0422\u0430\u0447\u0441\u043a\u0440\u0438\u043d<br \/>&#8212; \u041a\u043e\u043c\u0431\u0438\u043d\u0430\u0446\u0438\u0438 \u0433\u043e\u0440\u044f\u0447\u0438\u0445 \u043a\u043b\u0430\u0432\u0438\u0448<br \/>&#8212; \u042d\u043a\u0440\u0430\u043d\u043d\u0430\u044f \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u0430<br \/>&#8212; UI \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 (\u043a\u043d\u043e\u043f\u043a\u0438 \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u0438)<br \/>&#8212; \u041a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u043d\u043e\u0435 \u043c\u0435\u043d\u044e<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<ul>\n<li>\n<p>\u0414\u043b\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 UI \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 (\u0434\u043b\u044f \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432) \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u043f\u0440\u0435\u0434\u0443\u0441\u043c\u043e\u0442\u0440\u0435\u043d \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0432\u0432\u043e\u0434.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b UI \u043c\u043e\u0433\u0443\u0442 \u043f\u0440\u0435\u0434\u0443\u0441\u043c\u0430\u0442\u0440\u0438\u0432\u0430\u0442\u044c \u0432\u0432\u043e\u0434 \u0434\u043b\u044f \u0440\u0430\u0437\u043d\u044b\u0445 \u0442\u0438\u043f\u043e\u0432 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432\u043f\u0438\u0441\u0430\u0442\u044c \u0434\u0430\u0442\u0443 \u0441 \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u044b \u0438\u043b\u0438 \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u0434\u0430\u0442\u0443 \u0432 \u043f\u0438\u043a\u0435\u0440\u0435 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043c\u044b\u0448\u0438).<\/p>\n<\/li>\n<li>\n<p>\u0420\u0430\u0437\u043d\u044b\u043c\u0438 \u0442\u0438\u043f\u0430\u043c\u0438 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432 \u043c\u043e\u0436\u0435\u0442 \u0434\u043e\u0441\u0442\u0438\u0433\u0430\u0442\u044c\u0441\u044f \u0438 \u0440\u0430\u0437\u043d\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441\u043a\u0440\u043e\u043b\u043b \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0442\u0430\u0447\u043f\u0430\u0434\u0430 \u043c\u043e\u0436\u0435\u0442 \u043e\u043a\u0430\u0437\u0430\u0442\u044c\u0441\u044f \u043f\u043b\u0430\u0432\u043d\u0435\u0435, \u0447\u0435\u043c \u043a\u043e\u043b\u0451\u0441\u0438\u043a\u043e\u043c \u043c\u044b\u0448\u0438).<\/p>\n<\/li>\n<li>\n<p>\u0422\u0430\u043a\u0436\u0435 \u0434\u043b\u044f \u043f\u043e\u0434\u0442\u0432\u0435\u0440\u0436\u0434\u0435\u043d\u0438\u044f \u0432\u0432\u043e\u0434\u0430 \u0432 \u043f\u043e\u043b\u0435 \u0438\u043b\u0438 \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u0444\u043e\u0440\u043c\u044b \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0441\u043b\u0443\u0436\u0438\u0442\u044c \u043a\u043b\u0430\u0432\u0438\u0448\u0430 &#171;Enter&#187; (\u0434\u0430\u0436\u0435 \u0435\u0441\u043b\u0438 \u0440\u044f\u0434\u043e\u043c \u0441 \u043f\u043e\u043b\u0435\u043c\/\u0444\u043e\u0440\u043c\u043e\u0439 \u0431\u0443\u0434\u0435\u0442 \u043a\u043d\u043e\u043f\u043a\u0430, \u0440\u0435\u0430\u0433\u0438\u0440\u0443\u044e\u0449\u0430\u044f \u043d\u0430 \u0438\u043d\u043f\u0443\u0442 \u043e\u0442 \u043c\u044b\u0448\u0438).<\/p>\n<\/li>\n<li>\n<p>\u0414\u043b\u044f \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 Web \u043f\u0440\u0435\u0434\u0443\u0441\u043c\u0430\u0442\u0440\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0432\u044b\u0437\u043e\u0432\u0430 \u044d\u043a\u0440\u0430\u043d\u043d\u043e\u0439 \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u044b \u0434\u043b\u044f \u0432\u0432\u043e\u0434\u0430 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0432\u0440\u0443\u0447\u043d\u0443\u044e.<\/p>\n<\/li>\n<li>\n<p>\u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u0442\u0438\u043f\u043e\u0432 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432, \u043f\u0440\u0435\u0434\u0443\u0441\u043c\u0430\u0442\u0440\u0438\u0432\u0430\u044e\u0449\u0438\u0445 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u0439:<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u0442\u0438\u043f\u043e\u0432 UI input-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 (\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0441 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u043c \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435\u043c):<\/summary>\n<div class=\"spoiler__content\">\n<p>&lt;input type=&#187;&#187;><\/p>\n<ul>\n<li>\n<p>&#171;<strong>text<\/strong>&#187; \u2014 \u043e\u0434\u043d\u043e\u0441\u0442\u0440\u043e\u0447\u043d\u043e\u0435 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u043e\u0435 \u043f\u043e\u043b\u0435<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>number<\/strong>&#187; \u2014 \u043e\u0434\u043d\u043e\u0441\u0442\u0440\u043e\u0447\u043d\u043e\u0435 \u0447\u0438\u0441\u043b\u043e\u0432\u043e\u0435 \u043f\u043e\u043b\u0435<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>password<\/strong>&#187; \u2014 \u043e\u0434\u043d\u043e\u0441\u0442\u0440\u043e\u0447\u043d\u043e\u0435 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u043e\u0435 \u043f\u043e\u043b\u0435 \u043f\u043e\u043b\u0435, \u0441\u043a\u0440\u044b\u0432\u0430\u0435\u0442 \u0432\u0432\u043e\u0434\u0438\u043c\u044b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>tel<\/strong>&#187; \u2014 \u043e\u0434\u043d\u043e\u0441\u0442\u0440\u043e\u0447\u043d\u043e\u0435 \u043f\u043e\u043b\u0435 \u0434\u043b\u044f \u0432\u0432\u043e\u0434\u0430 \u0442\u0435\u043b\u0435\u0444\u043e\u043d\u043d\u043e\u0433\u043e \u043d\u043e\u043c\u0435\u0440\u0430 \u043f\u043e \u0437\u0430\u0434\u0430\u043d\u043d\u043e\u0439 \u043c\u0430\u0441\u043a\u0435 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 &#171;<strong>+7(_ _ <em>)<\/em> _ <em>&#8212;<\/em> <em>&#8212;<\/em> _<\/strong>&#171;)<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>search<\/strong>&#187; \u2014 \u043e\u0434\u043d\u043e\u0441\u0442\u0440\u043e\u0447\u043d\u043e\u0435 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u043e\u0435 \u043f\u043e\u043b\u0435 \u0434\u043b\u044f \u043f\u043e\u0438\u0441\u043a\u0430<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>checkbox<\/strong>&#187; \u2014 \u0444\u043b\u0430\u0436\u043e\u043a \u0434\u043b\u044f \u0432\u044b\u0431\u043e\u0440\u0430\/\u043e\u0442\u043c\u0435\u043d\u044b \u0432\u044b\u0431\u043e\u0440\u0430 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u0432<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>radio<\/strong>&#187; \u2014 \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u0442\u0435\u043b\u044c \u0434\u043b\u044f \u0432\u044b\u0431\u043e\u0440\u0430 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0434\u043d\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0438\u0437 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u0432<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>range<\/strong>&#187; \u2014 \u0434\u0438\u0430\u043f\u0430\u0437\u043e\u043d \u0432 \u0432\u0438\u0434\u0435 \u0441\u043b\u0430\u0439\u0434\u0435\u0440\u0430 \u0434\u043b\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0432\u0432\u043e\u0434\u043e\u043c \u043d\u0435 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u044f \u0442\u043e\u0447\u043d\u044b\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>button<\/strong>&#187; \u2014 \u043e\u0431\u044b\u0447\u043d\u0430\u044f \u043a\u043d\u043e\u043f\u043a\u0430<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>submit<\/strong>&#187; \u2014 \u043a\u043d\u043e\u043f\u043a\u0430 \u0434\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u0444\u043e\u0440\u043c\u044b<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>reset<\/strong>&#187; \u2014 \u043a\u043d\u043e\u043f\u043a\u0430 \u0434\u043b\u044f \u0441\u0431\u0440\u043e\u0441\u0430 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u0444\u043e\u0440\u043c\u044b \u043a \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c \u043f\u043e-\u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>date<\/strong>&#187; \u2014 \u043f\u0438\u043a\u0435\u0440 \u0434\u043b\u044f \u0432\u044b\u0431\u043e\u0440\u0430 \u0434\u0430\u0442\u044b (\u0433\u043e\u0434, \u043c\u0435\u0441\u044f\u0446, \u0434\u0435\u043d\u044c, \u0431\u0435\u0437 \u0432\u0440\u0435\u043c\u0435\u043d\u0438)<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>datetime-local<\/strong>&#187; (&#171;datetime&#187;) \u2014 \u043f\u0438\u043a\u0435\u0440 \u0434\u043b\u044f \u0432\u044b\u0431\u043e\u0440\u0430 \u0434\u0430\u0442\u044b \u0438 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 (\u0431\u0435\u0437 \u0447\u0430\u0441\u043e\u0432\u043e\u0433\u043e \u043f\u043e\u044f\u0441\u0430)<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>time<\/strong>&#187; \u2014 \u043f\u0438\u043a\u0435\u0440 \u0434\u043b\u044f \u0432\u0432\u043e\u0434\u0430 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 (\u0431\u0435\u0437 \u0447\u0430\u0441\u043e\u0432\u043e\u0433\u043e \u043f\u043e\u044f\u0441\u0430)<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>week<\/strong>&#187; \u2014 \u043f\u0438\u043a\u0435\u0440 \u0434\u043b\u044f \u0432\u044b\u0431\u043e\u0440\u0430 \u0434\u0430\u0442\u044b \u0432 \u0444\u043e\u0440\u043c\u0430\u0442\u0435: \u043d\u043e\u043c\u0435\u0440 \u043d\u0435\u0434\u0435\u043b\u0438, \u0433\u043e\u0434<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>month<\/strong>&#187; \u2014 \u043f\u0438\u043a\u0435\u0440 \u0434\u043b\u044f \u0432\u044b\u0431\u043e\u0440\u0430 \u0432 \u0444\u043e\u0440\u043c\u0430\u0442\u0435: \u043c\u0435\u0441\u044f\u0446, \u0433\u043e\u0434<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>color<\/strong>&#187; \u2014 \u043f\u0438\u043a\u0435\u0440 \u0434\u043b\u044f \u0432\u044b\u0431\u043e\u0440\u0430 \u0446\u0432\u0435\u0442\u0430 \u0438\u043b\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u044f \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0446\u0432\u0435\u0442\u043e\u0432<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>file<\/strong>&#187; \u2014 \u043a\u043d\u043e\u043f\u043a\u0430 \u0434\u043b\u044f \u0432\u044b\u0431\u043e\u0440\u0430 \u0444\u0430\u0439\u043b\u0430<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>image<\/strong>&#187; \u2014 \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u043a\u043d\u043e\u043f\u043a\u0430 &#171;submit&#187;<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>email<\/strong>&#187; \u2014 \u043f\u043e\u043b\u0435 \u0434\u043b\u044f \u0432\u0432\u043e\u0434\u0430 \u043f\u043e\u0447\u0442\u044b, \u043e\u0442\u043b\u0438\u0447\u0430\u0435\u0442\u0441\u044f \u043e\u0442 &#171;text&#187; \u043d\u0430\u043b\u0438\u0447\u0438\u0435\u043c \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u043e\u0432 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u0432\u0432\u043e\u0434\u0438\u043c\u044b\u0445 \u0434\u0430\u043d\u043d\u044b\u0445<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>url<\/strong>&#187; \u2014 \u043f\u043e\u043b\u0435 \u0434\u043b\u044f \u0432\u0432\u043e\u0434\u0430 \u0430\u0434\u0440\u0435\u0441\u0430, \u043e\u0442\u043b\u0438\u0447\u0430\u0435\u0442\u0441\u044f \u043e\u0442 &#171;text&#187; \u043d\u0430\u043b\u0438\u0447\u0438\u0435\u043c \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u043e\u0432 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u0432\u0432\u043e\u0434\u0438\u043c\u044b\u0445 \u0434\u0430\u043d\u043d\u044b\u0445<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 HTML \u043a\u043e\u0434\u0430 \u0441 input-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u043c \u0442\u0438\u043f\u0430 &#171;search&#187;:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/397\/830\/9c7\/3978309c75e7dd5e54c4e6912c6ee9a7.png\" width=\"1364\" height=\"130\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/397\/830\/9c7\/3978309c75e7dd5e54c4e6912c6ee9a7.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0423 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0442\u0430\u043a\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043a\u0430\u043a \u043f\u0440\u0430\u0432\u0438\u043b\u043e \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0440\u044f\u0434 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e\u0442 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u0438\/\u0438\u043b\u0438 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430:<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u043d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0451\u043d\u043d\u044b\u0445 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u043e\u0432 UI input-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432:<\/summary>\n<div class=\"spoiler__content\">\n<ul>\n<li>\n<p>&#171;<strong>minlength<\/strong>&#187; \u2014 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u0441\u0438\u043c\u0432\u043e\u043b\u043e\u0432 \u0434\u043b\u044f \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0445 \u043f\u043e\u043b\u0435\u0439<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>maxlength<\/strong>&#187; \u2014 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u0441\u0438\u043c\u0432\u043e\u043b\u043e\u0432 \u0434\u043b\u044f \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0445 \u043f\u043e\u043b\u0435\u0439<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>min<\/strong>&#187; \u2014 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u0447\u0438\u0441\u043b\u043e\u0432\u044b\u0445 \u043f\u043e\u043b\u0435\u0439<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>max<\/strong>&#187; \u2014 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u0447\u0438\u0441\u043b\u043e\u0432\u044b\u0445 \u043f\u043e\u043b\u0435\u0439<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>step<\/strong>&#187; \u2014 \u0437\u0430\u0434\u0430\u0451\u0442 \u0448\u0430\u0433 \u043f\u0440\u0438\u0431\u0430\u0432\u043b\u044f\u0435\u043c\u044b\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0434\u043b\u044f \u0447\u0438\u0441\u043b\u043e\u0432\u044b\u0445 \u043f\u043e\u043b\u0435\u0439<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>size<\/strong>&#187; \u2014 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u0440\u0430\u0437\u043c\u0435\u0440 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>value<\/strong>&#187; \u2014 \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>pattern<\/strong>&#187; \u2014 \u0448\u0430\u0431\u043b\u043e\u043d, \u043f\u043e \u043a\u043e\u0442\u043e\u0440\u043e\u043c\u0443 \u043f\u0440\u043e\u0432\u043e\u0434\u0438\u0442\u0441\u044f \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u043d\u0430 \u0432\u0430\u043b\u0438\u0434\u043d\u043e\u0441\u0442\u044c \u0437\u0430\u043f\u043e\u043b\u043d\u0435\u043d\u043d\u043e\u0433\u043e \u043f\u043e\u043b\u044f (\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u0440\u0435\u0433\u0443\u043b\u044f\u0440\u043d\u044b\u0435 \u0432\u044b\u0440\u0430\u0436\u0435\u043d\u0438\u044f &#8212; &#171;RegExp&#187;)<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>placeholder<\/strong>&#187; \u2014 \u0442\u0435\u043a\u0441\u0442\/\u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0430 \u0432\u043d\u0443\u0442\u0440\u0438 \u043f\u043e\u043b\u044f<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>autocomplete<\/strong>&#187; \u2014 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0434\u043b\u044f \u0430\u0432\u0442\u043e\u0437\u0430\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u043f\u043e\u043b\u044f (\u0435\u0441\u043b\u0438 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u044b \u0434\u0430\u043d\u043d\u044b\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 email)<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>checked<\/strong>&#187; \u2014 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u0432\u043a\u043b\/\u0432\u044b\u043a\u043b \u0434\u043b\u044f \u0447\u0435\u043a-\u0431\u043e\u043a\u0441\u043e\u0432 \u0438 \u0440\u0430\u0434\u0438\u043e-\u043a\u043d\u043e\u043f\u043e\u043a<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>required<\/strong>&#187; \u2014 \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0437\u0430\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u043f\u043e\u043b\u044f<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>src<\/strong>&#187; \u2014 \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a, \u0433\u0434\u0435 \u0445\u0440\u0430\u043d\u0438\u0442\u0441\u044f \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>height<\/strong>&#187; \u2014 \u0437\u0430\u0434\u0430\u0451\u0442 \u0432\u044b\u0441\u043e\u0442\u0443 \u0434\u043b\u044f \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f<\/p>\n<\/li>\n<li>\n<p>&#171;<strong>width<\/strong>&#187; \u2014 \u0437\u0430\u0434\u0430\u0451\u0442 \u0448\u0438\u0440\u0438\u043d\u0443 \u0434\u043b\u044f \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f<\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u041f\u043e\u043c\u0438\u043c\u043e \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 UI \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0442\u0430\u043a\u0436\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0438 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u0439 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e UI \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430. \u042d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043a\u0430\u043a \u043f\u0430\u043d\u0435\u043b\u044c \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u0438 (\u00ab\u0432\u043f\u0435\u0440\u0451\u0434\u00bb, \u00ab\u043d\u0430\u0437\u0430\u0434\u00bb, \u00ab\u043e\u0431\u043d\u043e\u0432\u0438\u0442\u044c\u00bb), \u0442\u0430\u043a \u0438 \u0433\u043e\u0440\u044f\u0447\u0438\u0435 \u043a\u043b\u0430\u0432\u0438\u0448\u0438 \u0434\u043b\u044f \u0432\u044b\u0437\u043e\u0432\u0430 \u0442\u0430\u043a\u0438\u0445 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432, \u043a\u0430\u043a \u00ab\u043d\u0430\u0439\u0442\u0438 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u00bb.<\/p>\n<\/li>\n<li>\n<p>\u0412\u0438\u0434\u044b \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0442\u044c\u0441\u044f:<\/p>\n<ul>\n<li>\n<p>\u0424\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0435 UI \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435<\/p>\n<\/li>\n<li>\n<p>\u0418\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 (&#171;Exploratory testing&#187;)<\/p>\n<\/li>\n<li>\n<p>Ad-Hoc \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 (&#171;\u0418\u043d\u0442\u0443\u0438\u0442\u0438\u0432\u043d\u043e\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435&#187;)<\/p>\n<\/li>\n<li>\n<p>\u041a\u0440\u043e\u0441\u0441-\u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043d\u043e\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<hr\/>\n<p><a class=\"anchor\" name=\"nastrojka\" id=\"nastrojka\"><\/a><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td data-colwidth=\"253\" width=\"253\">\n<p align=\"left\"><strong>\u041e\u0431\u043b\u0430\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u044f<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"253\" width=\"253\">\n<p align=\"left\"><strong>\u041a\u043b\u0430\u0441\u0441<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 (\u041f\u041e \u0434\u043b\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430)<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"253\" width=\"253\">\n<p align=\"left\"><strong>\u041e\u0431\u044a\u0435\u043a\u0442\u044b<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212; \u041f\u043b\u0430\u0433\u0438\u043d\u044b (\u0420\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f)<br \/>&#8212; \u0412\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b<br \/>&#8212; \u0420\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u044f (Permissions)<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<ul>\n<li>\n<p>\u041f\u0440\u0438 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441 Web&#8217;\u043e\u043c \u0441\u0442\u043e\u0438\u0442 \u043f\u043e\u043c\u043d\u0438\u0442\u044c \u043e \u0442\u043e\u043c, \u0447\u0442\u043e \u0443 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u0435\u0441\u0442\u044c \u043d\u0430\u0431\u043e\u0440 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0445 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0442\u0430\u043a\u0438\u0435 \u043a\u0430\u043a &#171;Opera Turbo Mode&#187; \u0434\u043b\u044f \u043f\u043e\u0432\u044b\u0448\u0435\u043d\u0438\u044f \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446 (\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e\u043c \u0432\u044b\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u0432 Opera \u0434\u043b\u044f \u0441\u0436\u0430\u0442\u0438\u044f \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439).<\/p>\n<\/li>\n<li>\n<p>\u041a \u0442\u043e\u043c\u0443 \u0436\u0435 \u0434\u043b\u044f \u0431\u043e\u043b\u044c\u0448\u0438\u043d\u0441\u0442\u0432\u0430 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u043e\u0433\u0440\u043e\u043c\u043d\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 &#171;3-rd party&#187; \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0439\/\u0434\u043e\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0441\u043f\u043e\u0441\u043e\u0431\u043d\u044b \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0432 \u0444\u043e\u043d\u0435.<\/p>\n<\/li>\n<li>\n<p>\u0412\u0441\u0451 \u0432\u044b\u0448\u0435\u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d\u043d\u043e\u0435 \u043c\u043e\u0436\u0435\u0442 \u0442\u0430\u043a \u0438\u043b\u0438 \u0438\u043d\u0430\u0447\u0435 \u043e\u0442\u0440\u0430\u0437\u0438\u0442\u044c\u0441\u044f \u043d\u0430 \u0440\u0430\u0431\u043e\u0442\u0435 Web&#8217;\u0430 \u0438\/\u0438\u043b\u0438 \u0441\u0435\u0440\u0432\u0438\u0441\u043e\u0432.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041a\u0435\u0439\u0441 \u0441 \u0440\u0435\u0430\u043b\u044c\u043d\u044b\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u043e\u043c \u2014 AdBlock \u0438 Google Analytics:<\/summary>\n<div class=\"spoiler__content\">\n<p><em>\u0412\u043e \u0432\u0440\u0435\u043c\u044f \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f GA-\u0441\u0435\u0440\u0432\u0438\u0441\u0430 \u043d\u0430 \u043f\u0440\u043e\u0434\u0430\u043a\u0448\u0435\u043d\u0435 \u0431\u044b\u043b\u043e \u0437\u0430\u043c\u0435\u0447\u0435\u043d\u043e, \u0447\u0442\u043e \u043d\u0435 \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u0442\u0441\u044f \u0441\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0430 \u043f\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u044b\u043c \u0441\u043e\u0431\u044b\u0442\u0438\u044f\u043c (\u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u043b \u0431\u044b\u0442\u044c \u0434\u0435\u0442\u0435\u043a\u0442 \u043d\u0430 \u0432\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0442\u043e\u0433\u0433\u043b\u0430 \u0438 \u0434\u0430\u043b\u0435\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0430 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0438 \u0432 \u0430\u043d\u0430\u043b\u0438\u0442\u0438\u043a\u0443).<\/em><br \/><em>\u041a\u0430\u043a \u0432\u044b\u044f\u0441\u043d\u0438\u043b\u043e\u0441\u044c, \u0432\u0441\u0435\u043c\u0443 \u0432\u0438\u043d\u043e\u0439 \u0432\u043a\u043b\u044e\u0447\u0451\u043d\u043d\u044b\u0439 AdBlock, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0437\u0430\u0431\u043b\u043e\u043a\u0438\u0440\u043e\u0432\u0430\u043b \u0440\u0430\u0431\u043e\u0442\u0443 GA-\u0441\u0435\u0440\u0432\u0438\u0441\u0430, \u0438 \u0442\u0435\u043c \u0441\u0430\u043c\u044b\u043c \u00ab\u0441\u0430\u0431\u043e\u0442\u0438\u0440\u043e\u0432\u0430\u043b\u00bb \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0443 \u0434\u0430\u043d\u043d\u044b\u0445. \u0414\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u0432 \u0441\u043f\u0438\u0441\u043e\u043a \u0440\u0430\u0437\u0440\u0435\u0448\u0451\u043d\u043d\u044b\u0445 \u043e\u043a\u0430\u0437\u0430\u043b\u043e\u0441\u044c \u043c\u0430\u043b\u043e, \u0438 \u043f\u0440\u0438\u0448\u043b\u043e\u0441\u044c \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043e\u0442\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u044d\u0442\u043e \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435.<\/em><\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f \u043f\u0440\u0438\u043d\u043e\u0441\u044f\u0442 \u043f\u043e\u043b\u044c\u0437\u0443 \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f. \u0411\u043e\u043b\u0435\u0435 \u0442\u043e\u0433\u043e, \u0442\u0430\u043a\u0438\u0435 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f \u043f\u0438\u0448\u0443\u0442\u0441\u044f \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u043e \u0434\u043b\u044f \u0443\u0434\u043e\u0431\u0441\u0442\u0432\u0430 Web-\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f (\u043f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043e\u0431 \u044d\u0442\u043e\u043c \u0431\u0443\u0434\u0435\u0442 \u0432 \u043a\u043e\u043d\u0446\u0435).<\/p>\n<\/li>\n<li>\n<p>\u0412 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430\u0445 \u0432\u0441\u0442\u0440\u043e\u0435\u043d \u043e\u0431\u0448\u0438\u0440\u043d\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u0442\u0432\u0435\u0447\u0430\u0435\u0442 \u0437\u0430 \u043a\u043e\u043d\u0444\u0438\u0434\u0435\u043d\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0438 \u0431\u0435\u0437\u043e\u043f\u0430\u0441\u043d\u043e\u0441\u0442\u044c. \u041e\u043d \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u044f\u043c\u0438 \u0434\u043b\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442:<\/p>\n<ul>\n<li>\n<p>\u0411\u0443\u0434\u0443\u0442 \u043b\u0438 \u043f\u043e\u044f\u0432\u043b\u044f\u0442\u044c\u0441\u044f push-\u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u044f (\u043d\u043e\u0442\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438)<\/p>\n<\/li>\n<li>\n<p>\u0411\u0443\u0434\u0443\u0442 \u043b\u0438 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u043f\u0440\u043e\u0438\u0433\u0440\u044b\u0432\u0430\u0442\u044c \u0437\u0432\u0443\u043a\u0438<\/p>\n<\/li>\n<li>\n<p>\u0411\u0443\u0434\u0435\u0442 \u043b\u0438 \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u043c\u0438\u043a\u0440\u043e\u0444\u043e\u043d\u0443 \u0438\u043b\u0438 \u043a\u0430\u043c\u0435\u0440\u0435<\/p>\n<\/li>\n<li>\n<p>\u0421\u043c\u043e\u0436\u0435\u0442 \u043b\u0438 \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u0441\u0431\u043e\u0440 \u0433\u0435\u043e\u0434\u0430\u043d\u043d\u044b\u0445<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u043e\u0438\u0437\u043e\u0439\u0434\u0451\u0442 \u043b\u0438 \u0431\u043b\u043e\u043a\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0432\u0441\u043f\u043b\u044b\u0432\u0430\u044e\u0449\u0435\u0433\u043e \u043e\u043a\u043d\u0430, \u043f\u0435\u0440\u0435\u0430\u0434\u0440\u0435\u0441\u0430\u0446\u0438\u0438 \u0438\u043b\u0438 \u0440\u0435\u043a\u043b\u0430\u043c\u044b<\/p>\n<\/li>\n<li>\n<p>\u0421\u043c\u043e\u0436\u0435\u0442 \u043b\u0438 \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0442\u044c\u0441\u044f \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 (\u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0438, JavaScript, \u0448\u0440\u0438\u0444\u0442\u044b)<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041a\u0430\u043a \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u044f \u0441\u0430\u0439\u0442\u043e\u0432 (\u043d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 Chrome):<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u0412 \u0430\u0434\u0440\u0435\u0441\u043d\u043e\u0439 \u0441\u0442\u0440\u043e\u043a\u0435 \u0441\u0430\u0439\u0442\u0430 \u0435\u0441\u0442\u044c \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0430\u044f \u0438\u043a\u043e\u043d\u043a\u0430 \u0432 \u0432\u0438\u0434\u0435 \u0437\u0430\u043c\u043a\u0430 (\u0438\u043b\u0438 \u0442\u0440\u0435\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u0430 \u0441 \u043f\u0440\u0435\u0434\u0443\u043f\u0440\u0435\u0436\u0434\u0435\u043d\u0438\u0435\u043c \u0438\u043b\u0438 \u0437\u043d\u0430\u043a\u0430 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438).<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/69d\/ef4\/5da\/69def45dad8b98addb444edfb8ce4639.png\" width=\"356\" height=\"68\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/69d\/ef4\/5da\/69def45dad8b98addb444edfb8ce4639.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"2\">\n<li>\n<p>\u041f\u043e \u043d\u0430\u0436\u0430\u0442\u0438\u044e \u043d\u0430 \u044d\u0442\u0443 \u0438\u043a\u043e\u043d\u043a\u0443 \u043e\u0442\u043a\u0440\u043e\u0435\u0442\u0441\u044f \u043f\u043e\u043f-\u0430\u043f \u0441\u043e \u0441\u0432\u0435\u0434\u0435\u043d\u0438\u044f\u043c\u0438 \u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/169\/623\/1b0\/1696231b0710a65bf705eb0c6c5c0b64.png\" width=\"742\" height=\"336\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/169\/623\/1b0\/1696231b0710a65bf705eb0c6c5c0b64.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u0412\u044b\u0431\u0440\u0430\u0442\u044c \u043f\u0443\u043d\u043a\u0442 \u00ab\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0441\u0430\u0439\u0442\u043e\u0432\u00bb.<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u043e\u0438\u0437\u043e\u0439\u0434\u0451\u0442 \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u0432 \u0440\u0430\u0437\u0434\u0435\u043b\u00a0<a href=\"https:\/\/chrome:\/\/settings\/content\">chrome:\/\/settings\/content<\/a> \u043a \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u043c \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0433\u043e \u0441\u0430\u0439\u0442\u0430, \u0433\u0434\u0435 \u043c\u043e\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0443\u0432\u0438\u0434\u0435\u0442\u044c \u0432\u0441\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0435 \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u044f \u0438 \u0437\u0430\u0434\u0430\u0442\u044c \u043f\u0440\u0430\u0432\u0438\u043b\u0430 \u0434\u043b\u044f \u0438\u0445 \u0432\u044b\u0434\u0430\u0447\u0438.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/19a\/66b\/daa\/19a66bdaad303a79f64927a97e0405be.png\" width=\"1336\" height=\"1326\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/19a\/66b\/daa\/19a66bdaad303a79f64927a97e0405be.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0415\u0441\u043b\u0438 \u0432 \u043f\u0440\u0430\u0432\u0438\u043b\u0430\u0445 \u0434\u043b\u044f \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u044f \u0432\u044b\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u043e \u00ab\u0421\u043f\u0440\u0430\u0448\u0438\u0432\u0430\u0442\u044c\u00bb, \u0442\u043e \u0432 \u043c\u043e\u043c\u0435\u043d\u0442 \u0442\u0430\u043a\u043e\u0433\u043e \u043e\u0431\u0440\u0430\u0449\u0435\u043d\u0438\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0432\u044b\u0437\u043e\u0432\u0435\u0442 \u043f\u043e\u043f-\u0430\u043f \u0441 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u043c, \u0447\u0442\u043e \u0434\u0435\u043b\u0430\u0442\u044c \u0441 \u044d\u0442\u0438\u043c \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0435\u043c.\u00a0\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u043f\u0440\u0438 \u0441\u0440\u0430\u0431\u043e\u0442\u043a\u0435 push-\u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u0439:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/518\/89c\/0dc\/51889c0dc2b07aabdf143c7fe96977ff.png\" width=\"632\" height=\"256\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/518\/89c\/0dc\/51889c0dc2b07aabdf143c7fe96977ff.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0412\u0438\u0434\u044b \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0442\u044c\u0441\u044f:<\/p>\n<ul>\n<li>\n<p>\u0424\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435<\/p>\n<\/li>\n<li>\n<p>\u041a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u043e\u043d\u043d\u043e\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435<\/p>\n<\/li>\n<li>\n<p>\u041a\u0440\u043e\u0441\u0441-\u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043d\u043e\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<hr\/>\n<p><a class=\"anchor\" name=\"dannye\" id=\"dannye\"><\/a><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\"><strong>\u041e\u0431\u043b\u0430\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0420\u0435\u0441\u0443\u0440\u0441\u044b<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u041a\u043b\u0430\u0441\u0441<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0414\u0430\u043d\u043d\u044b\u0435<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u041e\u0431\u044a\u0435\u043a\u0442\u044b<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212; \u041a\u043b\u0438\u0435\u043d\u0442-\u0421\u0435\u0440\u0432\u0435\u0440<br \/>&#8212; Create, Read, Update, Delete<br \/>&#8212; \u0412\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f \u043d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 \u043a\u043b\u0438\u0435\u043d\u0442\u0430<br \/>&#8212; \u0412\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f \u043d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 \u0441\u0435\u0440\u0432\u0435\u0440\u0430<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<ul>\n<li>\n<p>\u041a\u043e\u0433\u0434\u0430 \u0440\u0435\u0447\u044c \u0437\u0430\u0445\u043e\u0434\u0438\u0442 \u043e \u0442\u0430\u043a\u043e\u043c \u043f\u043e\u043d\u044f\u0442\u0438\u0438 \u043a\u0430\u043a Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u0442\u043e \u0442\u0430\u043a \u0438\u043b\u0438 \u0438\u043d\u0430\u0447\u0435 \u043f\u043e\u0434\u0440\u0430\u0437\u0443\u043c\u0435\u0432\u0430\u0435\u0442\u0441\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 (\u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435, \u0447\u0442\u0435\u043d\u0438\u0435, \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435, \u0443\u0434\u0430\u043b\u0435\u043d\u0438\u0435 \u2014 &#171;CRUD&#187;).<\/p>\n<\/li>\n<li>\n<p>\u0412\u0432\u043e\u0434\u0438\u043c\u044b\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u043c \u0434\u0430\u043d\u043d\u044b\u0435 \u0434\u043e\u043b\u0436\u043d\u044b \u0431\u044b\u0442\u044c \u043f\u0440\u043e\u0432\u0430\u043b\u0438\u0434\u0438\u0440\u043e\u0432\u0430\u043d\u044b \u0434\u043b\u044f \u0438\u0437\u0431\u0435\u0436\u0430\u043d\u0438\u044f \u0441\u0431\u043e\u044f \u0432 \u0440\u0430\u0431\u043e\u0442\u0435 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0432\u043c\u0435\u0441\u0442\u043e \u0447\u0438\u0441\u043b\u0430 \u0432\u0432\u043e\u0434\u0438\u0442 \u0442\u0435\u043a\u0441\u0442).<\/p>\n<\/li>\n<li>\n<p>\u0422\u0430\u043a\u0430\u044f \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u043d\u0430 \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u0441\u0442\u044c \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u043e\u0432\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u043a\u0430\u043a \u0441\u043e \u0441\u0442\u043e\u0440\u043e\u043d\u044b Frontend \u0447\u0430\u0441\u0442\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0442\u0430\u043a \u0438 \u0441\u043e \u0441\u0442\u043e\u0440\u043e\u043d\u044b Backend.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 Frontend \u0434\u043b\u044f \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u0432\u0432\u043e\u0434\u0438\u043c\u044b\u0445 \u0434\u0430\u043d\u043d\u044b\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0440\u0430\u043d\u0435\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u043d\u044b\u0435 \u0442\u0438\u043f\u044b \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0438 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b. \u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u043a\u043b\u0438\u0435\u043d\u0442 \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0441\u0442\u0443\u043f\u0430\u0442\u044c \u043d\u0435\u043a\u0438\u043c \u0433\u0430\u0440\u0430\u043d\u0442\u043e\u043c, \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u044f \u044d\u0442\u0438 \u0434\u0430\u043d\u043d\u044b\u0435 \u0441\u043f\u0435\u0440\u0432\u0430 \u043d\u0430 \u0441\u0432\u043e\u0435\u0439 \u0441\u0442\u043e\u0440\u043e\u043d\u0435, \u0430 \u0437\u0430\u0442\u0435\u043c \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u044f \u0443\u0436\u0435 \u043f\u0440\u043e\u0432\u0430\u043b\u0438\u0434\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440, \u043a\u0430\u043a \u0431\u044b \u0437\u0430\u0449\u0438\u0449\u0430\u044f \u0435\u0433\u043e \u043e\u0442 \u043d\u0435\u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u0433\u043e \u0432\u0432\u043e\u0434\u0430.<\/p>\n<\/li>\n<li>\n<p>\u041e\u0434\u043d\u0430\u043a\u043e:<\/p>\n<ul>\n<li>\n<p>\u0417\u0430\u043f\u0440\u043e\u0441 \u043e\u0442 \u043a\u043b\u0438\u0435\u043d\u0442\u0430 \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0445\u0432\u0430\u0442\u0438\u0442\u044c \u0438 \u043c\u043e\u0434\u0438\u0444\u0438\u0446\u0438\u0440\u043e\u0432\u0430\u0442\u044c, \u043e\u0442\u043f\u0440\u0430\u0432\u0438\u0432 \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440 \u0432\u0441\u0451 \u0447\u0442\u043e \u0443\u0433\u043e\u0434\u043d\u043e, \u0442\u0435\u043c \u0441\u0430\u043c\u044b\u043c \u043f\u043e\u0441\u0442\u0430\u0432\u0438\u0432 \u043f\u043e\u0434 \u0443\u0433\u0440\u043e\u0437\u0443 \u0435\u0433\u043e \u0440\u0430\u0431\u043e\u0442\u043e\u0441\u043f\u043e\u0441\u043e\u0431\u043d\u043e\u0441\u0442\u044c.<\/p>\n<\/li>\n<li>\n<p>\u041a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0441 \u0434\u0435\u0444\u0435\u043a\u0442\u043e\u043c, \u043d\u0435 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u044f \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044e \u043f\u043e\u043b\u044f \u0438\u043b\u0438 \u0436\u0435 \u043f\u0440\u0430\u0432\u0438\u043b\u0430 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u0434\u0430\u043d\u043d\u044b\u0435 \u0431\u0443\u0434\u0443\u0442 \u043e\u0442\u043b\u0438\u0447\u0430\u0442\u044c\u0441\u044f \u043e\u0442 \u0442\u0435\u0445, \u0447\u0442\u043e \u043e\u0436\u0438\u0434\u0430\u0435\u0442 \u0441\u0435\u0440\u0432\u0435\u0440.<\/p>\n<\/li>\n<li>\n<p>\u0410 \u0432 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0441\u043b\u0443\u0447\u0430\u044f\u0445 API (\u0434\u043b\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c) \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043e\u0442\u043a\u0440\u044b\u0442 \u0438\/\u0438\u043b\u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c\u0441\u044f \u0434\u043b\u044f \u0438\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u0438 \u0432 \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p>\u041f\u043e\u044d\u0442\u043e\u043c\u0443, \u0447\u0442\u043e\u0431\u044b \u043e\u0431\u0435\u0437\u043e\u043f\u0430\u0441\u0438\u0442\u044c \u0441\u0435\u0440\u0432\u0435\u0440, \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044f \u043d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 Backend, \u0438 \u0432 \u0441\u043b\u0443\u0447\u0430\u0435 \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u0441 \u043d\u0435\u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u044b\u043c\u0438 \u0434\u0430\u043d\u043d\u044b\u043c\u0438 \u043e\u043d \u0432\u0435\u0440\u043d\u0451\u0442 \u043e\u0448\u0438\u0431\u043a\u0443 \u0438 \u043d\u0435 \u0441\u0442\u0430\u043d\u0435\u0442 \u0434\u0430\u043b\u044c\u0448\u0435 \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u0442\u0430\u043a\u043e\u0439 \u0437\u0430\u043f\u0440\u043e\u0441.<\/p>\n<\/li>\n<li>\n<p>\u0421\u0442\u043e\u0438\u0442 \u0443\u043f\u043e\u043c\u044f\u043d\u0443\u0442\u044c \u0438 \u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u0436\u0438\u0437\u043d\u0438 (Time to Live \u2014 TTL) \u0441\u0435\u0441\u0441\u0438\u0438 \u043d\u0430 Backend, \u043f\u043e \u0438\u0441\u0442\u0435\u0447\u0435\u043d\u0438\u044e \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043a\u043b\u0438\u0435\u043d\u0442 \u043d\u0435 \u0441\u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0441\u043b\u0430\u0442\u044c \u0437\u0430\u043f\u0440\u043e\u0441 \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440. \u0412\u0435\u0440\u043d\u0435\u0435 \u0441\u043c\u043e\u0436\u0435\u0442, \u043d\u043e \u0441\u0435\u0440\u0432\u0435\u0440 \u0432\u0435\u0440\u043d\u0451\u0442 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0443\u044e \u043e\u0448\u0438\u0431\u043a\u0443. \u042d\u0442\u043e \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c \u0437\u0430\u0449\u0438\u0442\u044b \u0441\u0435\u0440\u0432\u0435\u0440\u0430, \u0438 \u0440\u0435\u0433\u0443\u043b\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043e\u043d \u043d\u0430 Backend. \u041a\u043b\u0438\u0435\u043d\u0442 \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c \u0441\u0435\u0441\u0441\u0438\u044e \u0432 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u043c \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0438, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u044f \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440 keep-alive \u0437\u0430\u043f\u0440\u043e\u0441\u044b.<\/p>\n<\/li>\n<li>\n<p>Cache, Cookie, Session Storage \u0438 Local Storage \u2014 \u044d\u0442\u043e \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u044b\u0435 \u00ab\u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0430\u00bb \u0434\u0430\u043d\u043d\u044b\u0445, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0434\u043b\u044f \u043e\u0431\u043c\u0435\u043d\u0430 \u0441 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c.<\/p>\n<\/li>\n<li>\n<p>\u0423 \u0432\u0441\u0435\u0445 \u044d\u0442\u0438\u0445 \u00ab\u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u00bb \u0441\u0432\u043e\u0438 \u0437\u0430\u0434\u0430\u0447\u0438:<\/p>\n<ul>\n<li>\n<p>Cache (&#171;\u041a\u044d\u0448&#187;) \u2014 \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u0435\u0442, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043d\u0442, \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d\u043d\u044b\u0439 \u0441 \u0441\u0435\u0440\u0432\u0435\u0440\u0430, \u0438 \u0437\u0430\u0442\u0435\u043c \u0443\u0436\u0435 \u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0441 \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0434\u0438\u0441\u043a\u0430 (\u0435\u0441\u043b\u0438 \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u043d\u0435 \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u0441\u044f \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435), \u0447\u0442\u043e\u0431\u044b \u043d\u0435 \u0441\u043a\u0430\u0447\u0438\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u043e.<\/p>\n<\/li>\n<li>\n<p>Cookie (&#171;\u041a\u0443\u043a\u0438&#187;) \u2014 \u0445\u0440\u0430\u043d\u044f\u0442 \u0432 \u0441\u0435\u0431\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e\u0431 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043d\u0430 \u0441\u0430\u0439\u0442\u0435, \u0435\u0433\u043e \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u0445 \u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0441\u0430\u0439\u0442\u0430 \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0434\u043b\u044f \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u043d\u0438\u044f \u0441\u0435\u0441\u0441\u0438\u0438.<\/p>\n<\/li>\n<li>\n<p>Local Storage \u2014 \u0445\u0440\u0430\u043d\u0438\u0442 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043e \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0434\u043b\u044f \u0441\u0430\u0439\u0442\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u044b \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u0441\u0435\u0441\u0441\u0438\u044f\u0445.<\/p>\n<\/li>\n<li>\n<p>Session Storage \u2014 \u0442\u0430\u043a \u0436\u0435 \u043a\u0430\u043a \u0438 Local Storage \u0445\u0440\u0430\u043d\u0438\u0442 \u0434\u0430\u043d\u043d\u044b\u0435, \u043d\u043e \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u043a\u0430 \u0430\u043a\u0442\u0438\u0432\u043d\u0430 \u0441\u0435\u0441\u0441\u0438\u044f. \u041f\u043e\u0441\u043b\u0435 \u0437\u0430\u043a\u0440\u044b\u0442\u0438\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u0438\u043b\u0438 \u0432\u043a\u043b\u0430\u0434\u043a\u0438 Session Storage \u043e\u0447\u0438\u0449\u0430\u0435\u0442\u0441\u044f.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u0413\u0434\u0435 \u0445\u0440\u0430\u043d\u044f\u0442\u0441\u044f Cache, Cookie, Local \u0438 Session Storage:<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c DevTools \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 (F12 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e).<\/p>\n<\/li>\n<li>\n<p>\u041f\u0435\u0440\u0435\u0439\u0442\u0438 \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0443 &#171;Application&#187;.<\/p>\n<\/li>\n<\/ol>\n<p>\u0412 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u00a0<strong>Cache Storage<\/strong>\u00a0\u043a\u044d\u0448\u0438\u0440\u0443\u044e\u0442\u0441\u044f \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0435 \u0444\u0430\u0439\u043b\u044b, \u0434\u043b\u044f \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u043c\u0435\u0442\u043e\u0434\u044b Cache API:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/09f\/57a\/fda\/09f57afdaffe723b3d1c309682b5ffc7.png\" width=\"2046\" height=\"1128\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/09f\/57a\/fda\/09f57afdaffe723b3d1c309682b5ffc7.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0412 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u043e\u043c \u0436\u0435 \u043a\u044d\u0448 \u0437\u0430\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e \u043d\u0430 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e, \u0438 \u0435\u0433\u043e \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0437\u0430\u0432\u0438\u0441\u0438\u0442 \u043e\u0442 \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u043e\u043d\u043d\u043e\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u044b (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 Windows:\u00a0%LOCALAPPDATA%LocalGoogleChromeUser DataDefault).<\/p>\n<\/li>\n<li>\n<p>\u041a\u044d\u0448 \u0445\u0440\u0430\u043d\u0438\u0442\u0441\u044f \u0432 \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u043c \u0434\u043b\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u0444\u043e\u0440\u043c\u0430\u0442\u0435, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043f\u0440\u043e\u0441\u0442\u043e \u0442\u0430\u043a \u043e\u0442\u043a\u0440\u044b\u0442\u044c \u044d\u0442\u0438 \u0444\u0430\u0439\u043b\u044b \u043d\u0435 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u0441\u044f (\u0435\u0441\u0442\u044c \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u044b \u0434\u043b\u044f \u043f\u0440\u043e\u0441\u043c\u043e\u0442\u0440\u0430 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e, \u043d\u043e \u043e\u0431\u044b\u0447\u043d\u043e \u044d\u0442\u043e \u043d\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f).<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/f80\/931\/420\/f80931420063d04e0ae32e45dd8438df.png\" width=\"680\" height=\"275\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/f80\/931\/420\/f80931420063d04e0ae32e45dd8438df.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0420\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043a\u044d\u0448\u0430 Google Chrome \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0445 \u0441\u0438\u0441\u0442\u0435\u043c\u0430\u0445:\u00a0<a href=\"https:\/\/chromium.googlesource.com\/chromium\/src\/+\/master\/docs\/user_data_dir.md\">User Data Directory<\/a>.<\/p>\n<\/li>\n<li>\n<p>\u041a\u0430\u043a\u0438\u0445-\u0442\u043e \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u0447\u043d\u044b\u0445 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u043d\u0430\u0434 \u043a\u044d\u0448\u0435\u043c \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u044c \u043d\u0435 \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u0442\u0441\u044f, \u043d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u0445\u043e\u0434\u043e\u0432\u043e\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u2014 \u044d\u0442\u043e \u043e\u0447\u0438\u0441\u0442\u043a\u0430 \u043a\u044d\u0448\u0430, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u0434\u0433\u0440\u0443\u0437\u0438\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u0441\u0432\u0435\u0436\u0438\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0441 Web-\u0441\u0435\u0440\u0432\u0435\u0440\u0430.<\/p>\n<\/li>\n<li>\n<p>\u0412 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u00a0<strong>Cookie<\/strong>\u00a0\u043c\u043e\u0436\u043d\u043e \u0432\u0438\u0434\u0435\u0442\u044c, \u043a\u0430\u043a\u0438\u0435 \u043a\u0443\u043a\u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u044e\u0442\u0441\u044f \u043e\u0442 \u043a\u043b\u0438\u0435\u043d\u0442\u0430 \u0441 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u043c.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/ca7\/b65\/4ad\/ca7b654ad73984f8a06a81cf8c9d94d4.png\" width=\"2336\" height=\"1126\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ca7\/b65\/4ad\/ca7b654ad73984f8a06a81cf8c9d94d4.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u041a\u0443\u043a\u0438 \u043c\u043e\u0436\u043d\u043e \u043c\u043e\u0434\u0438\u0444\u0438\u0446\u0438\u0440\u043e\u0432\u0430\u0442\u044c (\u043f\u043e\u0434\u043c\u0435\u043d\u044f\u0442\u044c) \u0438 \u043f\u0435\u0440\u0435\u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0441 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u043c, \u043e\u0434\u043d\u0430\u043a\u043e \u0448\u0442\u0430\u0442\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u043d\u0435 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u044d\u0442\u043e\u0433\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u043e\u0441\u0442\u0430\u0451\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0447\u0438\u0441\u0442\u0438\u0442\u044c \u0438\u0445 \u043f\u0440\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438:<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/5fa\/1b2\/cc1\/5fa1b2cc14683ca0ecbfd6c9301cc913.png\" width=\"380\" height=\"132\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/5fa\/1b2\/cc1\/5fa1b2cc14683ca0ecbfd6c9301cc913.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0412 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u00a0<strong>Session Storage<\/strong>\u00a0\u0445\u0440\u0430\u043d\u044f\u0442\u0441\u044f \u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u043f\u043e\u043a\u0430 \u0430\u043a\u0442\u0438\u0432\u043d\u0430 \u0441\u0435\u0441\u0441\u0438\u044f (\u043e\u0442\u043a\u0440\u044b\u0442\u043e \u043e\u043a\u043d\u043e\/\u0432\u043a\u043b\u0430\u0434\u043a\u0430):<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/261\/eb2\/cd7\/261eb2cd7ef0082a4c6aaa5b0b5a546a.png\" width=\"1844\" height=\"728\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/261\/eb2\/cd7\/261eb2cd7ef0082a4c6aaa5b0b5a546a.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0417\u0434\u0435\u0441\u044c \u0443\u0436\u0435 \u043c\u043e\u0436\u043d\u043e \u043c\u043e\u0434\u0438\u0444\u0438\u0446\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043a\u043b\u044e\u0447\u0435\u0439, \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u043d\u043e\u0432\u044b\u0435 \u043a\u043b\u044e\u0447\u0438, \u0443\u0434\u0430\u043b\u044f\u0442\u044c \u0441\u0442\u0430\u0440\u044b\u0435, \u0435\u0441\u043b\u0438 \u044d\u0442\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0443 \u0438 \u0440\u0430\u0437\u0443\u043c\u0435\u0435\u0442\u0441\u044f \u043c\u043e\u0436\u043d\u043e \u0438\u0445 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043e\u0447\u0438\u0441\u0442\u0438\u0442\u044c (\u043f\u043e \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0438 \u0441 cookie).<\/p>\n<\/li>\n<li>\n<p>\u0412 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u00a0<strong>Local Storage<\/strong>\u00a0\u0445\u0440\u0430\u043d\u044f\u0442\u0441\u044f \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u044b\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b, \u043f\u043e\u043a\u0430 \u0438\u0445 \u043d\u0435 \u0443\u0434\u0430\u043b\u0438\u0442 \u0441\u0430\u043c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c:<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/664\/6dc\/486\/6646dc486445b155e96c0a9c6a15ca7b.png\" width=\"1844\" height=\"742\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/664\/6dc\/486\/6646dc486445b155e96c0a9c6a15ca7b.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0418 \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u043e Session Storage \u0437\u0434\u0435\u0441\u044c \u043c\u043e\u0436\u043d\u043e \u043c\u043e\u0434\u0438\u0444\u0438\u0446\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043a\u043b\u044e\u0447\u0435\u0439, \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u043d\u043e\u0432\u044b\u0435 \u043a\u043b\u044e\u0447\u0438, \u0443\u0434\u0430\u043b\u044f\u0442\u044c \u0441\u0442\u0430\u0440\u044b\u0435, \u0435\u0441\u043b\u0438 \u044d\u0442\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e.<\/p>\n<\/li>\n<li>\n<p>\u0418 \u0441\u0430\u043c\u043e \u0441\u043e\u0431\u043e\u0439 \u043e\u0447\u0438\u0441\u0442\u0438\u0442\u044c \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e Local Storage:<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/386\/ea2\/1a5\/386ea21a5c1243009db36025d1b798d0.png\" width=\"486\" height=\"464\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/386\/ea2\/1a5\/386ea21a5c1243009db36025d1b798d0.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>\u041f\u043e\u043b\u043d\u0430\u044f \u043e\u0447\u0438\u0441\u0442\u043a\u0430 \u043a\u044d\u0448\u0430 \u0438 \u043a\u0443\u043a\u0438:<\/strong><\/p>\n<ol>\n<li>\n<p>\u0412 \u043c\u0435\u043d\u044e \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 Chrome \u043d\u0430\u0432\u0435\u0441\u0442\u0438 \u043d\u0430 \u00ab\u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b\u00bb.<\/p>\n<\/li>\n<li>\n<p>\u0412\u044b\u0431\u0440\u0430\u0442\u044c \u00ab\u041e\u0447\u0438\u0441\u0442\u0438\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u043f\u0440\u043e\u0441\u043c\u043e\u0442\u0440\u043e\u0432\u00bb.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/ed7\/3e7\/63a\/ed73e763a8adfcef27def0366ee23af8.png\" width=\"806\" height=\"127\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ed7\/3e7\/63a\/ed73e763a8adfcef27def0366ee23af8.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u0423\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u043f\u0435\u0440\u0438\u043e\u0434, \u0437\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u043e\u0447\u0438\u0441\u0442\u043a\u0430 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0437\u0430 \u0432\u0441\u0451 \u0432\u0440\u0435\u043c\u044f).<\/p>\n<\/li>\n<li>\n<p>\u0423\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u043d\u0443\u0436\u043d\u044b\u0435 \u0447\u0435\u043a-\u0431\u043e\u043a\u0441\u044b (\u00ab\u0424\u0430\u0439\u043b\u044b cookie \u0438 \u0434\u0440\u0443\u0433\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u0441\u0430\u0439\u0442\u043e\u0432\u00bb, \u00ab\u0418\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0438 \u0434\u0440\u0443\u0433\u0438\u0435 \u0444\u0430\u0439\u043b\u044b, \u0441\u043e\u0445\u0440\u0430\u043d\u0451\u043d\u043d\u044b\u0435 \u0432 \u043a\u0435\u0448\u0435\u00bb) \u0438 \u043d\u0430\u0436\u0430\u0442\u044c \u00ab\u0423\u0434\u0430\u043b\u0438\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435\u00bb.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/fa6\/7bd\/8a8\/fa67bd8a8d8587f670faea8d2cf986d8.png\" width=\"505\" height=\"466\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/fa6\/7bd\/8a8\/fa67bd8a8d8587f670faea8d2cf986d8.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0420\u0435\u0436\u0438\u043c \u0438\u043d\u043a\u043e\u0433\u043d\u0438\u0442\u043e \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435:<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/844\/979\/eff\/844979effb6f4f093daf9ee0f4fd8a60.png\" width=\"437\" height=\"86\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/844\/979\/eff\/844979effb6f4f093daf9ee0f4fd8a60.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041f\u0440\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0438 \u043e\u043a\u043d\u0430 \u0432 \u0440\u0435\u0436\u0438\u043c\u0435 \u0438\u043d\u043a\u043e\u0433\u043d\u0438\u0442\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u043a\u0430\u043a \u0431\u044b \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442 \u0440\u0430\u0431\u043e\u0442\u0443 \u00ab\u0441 \u0447\u0438\u0441\u0442\u043e\u0433\u043e \u043b\u0438\u0441\u0442\u0430\u00bb, \u043d\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f \u0441\u0442\u0430\u0440\u044b\u0439 \u043a\u044d\u0448 \u0438 \u043a\u0443\u043a\u0438.<br \/>\u041e\u043d \u0437\u0430\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442 \u044d\u0442\u0438 \u0434\u0430\u043d\u043d\u044b\u0435 \u0434\u043e \u0442\u0435\u0445 \u043f\u043e\u0440, \u043f\u043e\u043a\u0430 \u043e\u0442\u043a\u0440\u044b\u0442\u043e \u043e\u043a\u043d\u043e \u0432 \u044d\u0442\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435. \u041f\u043e\u0441\u043b\u0435 \u0437\u0430\u043a\u0440\u044b\u0442\u0438\u044f \u043e\u043a\u043d\u0430, \u0432\u0441\u0435 \u044d\u0442\u0438 \u00ab\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435\u00bb \u043a\u044d\u0448, \u043a\u0443\u043a\u0438 \u0438 \u043f\u0440\u043e\u0447\u0438\u0435 \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u0443\u0434\u0430\u043b\u044f\u044e\u0442\u0441\u044f.<br \/>\u042d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u043c\u043e\u0447\u044c \u0432 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438, \u0435\u0441\u043b\u0438 \u043d\u0430\u0434\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u0441\u0432\u0435\u0436\u0438\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0432\u043e Frontend \u0447\u0430\u0441\u0442\u0438 \u0447\u0435\u0440\u0435\u0437 \u043d\u043e\u0432\u0443\u044e \u0441\u0435\u0441\u0441\u0438\u044e, \u043d\u0435 \u043e\u0447\u0438\u0449\u0430\u044f \u043a\u044d\u0448 \u0438\/\u0438\u043b\u0438 \u043a\u0443\u043a\u0438.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/839\/db5\/de5\/839db5de5f5e05106da21fe12c6a3dab.png\" width=\"1232\" height=\"1054\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/839\/db5\/de5\/839db5de5f5e05106da21fe12c6a3dab.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u041a\u043b\u0438\u0435\u043d\u0442 \u0438 \u0441\u0435\u0440\u0432\u0435\u0440 \u043e\u0431\u0449\u0430\u044e\u0442\u0441\u044f \u043c\u0435\u0436\u0434\u0443 \u0441\u043e\u0431\u043e\u0439 \u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e\u043c HTTP (\u0437\u0430\u043f\u0440\u043e\u0441\/\u043e\u0442\u0432\u0435\u0442).<\/p>\n<\/li>\n<li>\n<p>\u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u043d\u0430\u0431\u043e\u0440 \u043a\u043e\u0434\u043e\u0432 (\u043e\u0442\u0432\u0435\u0442\u043e\u0432) \u043f\u0440\u0438 \u043e\u0431\u0449\u0435\u043d\u0438\u0438 \u043c\u0435\u0436\u0434\u0443 \u043a\u043b\u0438\u0435\u043d\u0442\u043e\u043c \u0438 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c. \u041f\u043e \u044d\u0442\u0438\u043c \u043a\u043e\u0434\u0430\u043c \u043c\u043e\u0436\u043d\u043e \u043e\u0446\u0435\u043d\u0438\u0432\u0430\u0442\u044c \u0440\u0430\u0431\u043e\u0442\u0443 \u0442\u043e\u0433\u043e \u0438\u043b\u0438 \u0438\u043d\u043e\u0433\u043e \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u043e\u0442 \u043a\u043b\u0438\u0435\u043d\u0442\u0430 \u043a \u0441\u0435\u0440\u0432\u0435\u0440\u0443.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u043d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0451\u043d\u043d\u044b\u0445 \u043a\u043e\u0434\u043e\u0432 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0439 HTTP:<\/summary>\n<div class=\"spoiler__content\">\n<p>\u0421\u0442\u043e\u0438\u0442 \u043d\u0430\u0447\u0430\u0442\u044c \u0441 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 5 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u0439 \u043a\u043e\u0434\u043e\u0432:<\/p>\n<ul>\n<li>\n<p>\u0418\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0435 (\u043a\u043e\u0434 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442\u0441\u044f \u0441 1)<\/p>\n<\/li>\n<li>\n<p>\u0423\u0441\u043f\u0435\u0448\u043d\u044b\u0435 (\u043a\u043e\u0434 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442\u0441\u044f \u0441 2)<\/p>\n<\/li>\n<li>\n<p>\u041f\u0435\u0440\u0435\u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f (\u043a\u043e\u0434 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442\u0441\u044f \u0441 3)<\/p>\n<\/li>\n<li>\n<p>\u041a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u0435 \u043e\u0448\u0438\u0431\u043a\u0438 (\u043a\u043e\u0434 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442\u0441\u044f \u0441 4)<\/p>\n<\/li>\n<li>\n<p>\u0421\u0435\u0440\u0432\u0435\u0440\u043d\u044b\u0435 \u043e\u0448\u0438\u0431\u043a\u0438 (\u043a\u043e\u0434 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442\u0441\u044f \u0441 5)<\/p>\n<\/li>\n<\/ul>\n<p>\u0418 \u0441\u0430\u043c\u044b\u0435 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u0435 \u0438\u0437 \u044d\u0442\u0438\u0445 \u043a\u043e\u0434\u043e\u0432:<\/p>\n<ul>\n<li>\n<p>101 (&#171;Switching Protocols&#187;) \u2014 \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u043e\u0432 \u043e\u0431\u043c\u0435\u043d\u0430 \u0441 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u0441 HTTP \u043d\u0430 WS<\/p>\n<\/li>\n<li>\n<p>200 (&#171;OK&#187;) \u2014 \u0443\u0441\u043f\u0435\u0448\u043d\u0430\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0437\u0430\u043f\u0440\u043e\u0441\u0430<\/p>\n<\/li>\n<li>\n<p>304 (&#171;Not Modified&#187;) \u2014 \u0441\u043e\u043e\u0431\u0449\u0430\u0435\u0442, \u0447\u0442\u043e \u0437\u0430\u043f\u0440\u0430\u0448\u0438\u0432\u0430\u0435\u043c\u044b\u0439 \u0440\u0435\u0441\u0443\u0440\u0441 \u043d\u0435 \u0431\u044b\u043b \u0438\u0437\u043c\u0435\u043d\u0451\u043d \u0438 \u0431\u0443\u0434\u0435\u0442 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d \u0438\u0437 \u043a\u044d\u0448\u0430<\/p>\n<\/li>\n<li>\n<p>400 (&#171;Bad Request&#187;) \u2014 \u043d\u0435\u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u044b\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0437\u0430\u043f\u0440\u043e\u0441\u0430<\/p>\n<\/li>\n<li>\n<p>401 (&#171;Unautorized&#187;) \u2014 \u0434\u043b\u044f \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u0430 \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f<\/p>\n<\/li>\n<li>\n<p>403 (&#171;Forbidden&#187;) \u2014 \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0437\u0430\u043f\u0440\u0430\u0448\u0438\u0432\u0430\u0435\u043c\u043e\u043c\u0443 \u0440\u0435\u0441\u0443\u0440\u0441\u0443 \u0437\u0430\u043f\u0440\u0435\u0449\u0451\u043d<\/p>\n<\/li>\n<li>\n<p>404 (&#171;Not Found&#187;) \u2014 \u0437\u0430\u043f\u0440\u0430\u0448\u0438\u0432\u0430\u0435\u043c\u044b\u0439 \u0440\u0435\u0441\u0443\u0440\u0441 \u043d\u0435 \u043d\u0430\u0439\u0434\u0435\u043d<\/p>\n<\/li>\n<li>\n<p>500 (&#171;Internal Server Error&#187;) \u2014 \u043b\u044e\u0431\u0430\u044f \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u044f\u044f \u043e\u0448\u0438\u0431\u043a\u0430, \u0432\u044b\u0437\u0432\u0430\u043d\u043d\u0430\u044f \u0440\u0430\u0431\u043e\u0442\u043e\u0439 \u0441\u0435\u0440\u0432\u0435\u0440\u0430<\/p>\n<\/li>\n<li>\n<p>502 (&#171;Bad Gateway&#187;) \u2014 \u0441\u0435\u0442\u0435\u0432\u0430\u044f \u043e\u0448\u0438\u0431\u043a\u0430 \u043d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 \u0441\u0435\u0440\u0432\u0435\u0440\u0430, \u0433\u043e\u0432\u043e\u0440\u0438\u0442 \u043e \u0435\u0433\u043e \u043d\u0435\u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e\u0441\u0442\u0438<\/p>\n<\/li>\n<li>\n<p>503 (&#171;Service Unavailable&#187;) \u2014 \u0441\u0435\u0440\u0432\u0438\u0441 \u0434\u043b\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u043f\u0435\u0440\u0435\u0433\u0440\u0443\u0436\u0435\u043d \u0438 \u043d\u0435 \u043c\u043e\u0436\u0435\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0438\u0442\u044c \u044d\u0442\u043e\u0442 \u0437\u0430\u043f\u0440\u043e\u0441<\/p>\n<\/li>\n<li>\n<p>504 (&#171;Gateway Timeout&#187;) \u2014 \u043f\u0440\u0435\u0432\u044b\u0448\u0435\u043d\u0438\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043e\u0436\u0438\u0434\u0430\u043d\u0438\u044f \u043e\u0442\u0432\u0435\u0442\u0430 \u043e\u0442 \u0441\u0435\u0440\u0432\u0435\u0440\u0430<\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0414\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c, \u043a\u0430\u043a\u0438\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u043b\u0438\u0441\u044c \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435, \u0438 \u043a\u0430\u043a\u0438\u043c\u0438 \u0437\u0430\u043f\u0440\u043e\u0441\u0430\u043c\u0438 \u0432\u044b\u0437\u044b\u0432\u0430\u043b\u0438\u0441\u044c \u044d\u0442\u0438 \u0440\u0435\u0441\u0443\u0440\u0441\u044b, \u043d\u0430\u043c \u0441\u043d\u043e\u0432\u0430 \u043f\u043e\u043c\u043e\u0436\u0435\u0442 DevTools.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u0412\u043a\u043b\u0430\u0434\u043a\u0430 &#171;Network&#187;:<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c DevTools \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 (F12 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e).<\/p>\n<\/li>\n<li>\n<p>\u041e\u0431\u043d\u043e\u0432\u0438\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443, \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u044c (\u0434\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b DevTools \u043f\u0435\u0440\u0435\u0445\u0432\u0430\u0442\u0438\u043b \u0432\u0441\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u044d\u0442\u043e\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, \u0430 \u0432\u0435\u0440\u043d\u0435\u0435 HTTP-\u0442\u0440\u0430\u0444\u0438\u043a).<\/p>\n<\/li>\n<li>\n<p>\u041f\u0435\u0440\u0435\u0439\u0442\u0438 \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0443 &#171;Network&#187;.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/d0f\/67d\/69a\/d0f67d69a0e950c62e874825ab7bf080.png\" width=\"1178\" height=\"54\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d0f\/67d\/69a\/d0f67d69a0e950c62e874825ab7bf080.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"4\">\n<li>\n<p>\u0412 \u0441\u043f\u0438\u0441\u043a\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432 \u043d\u0430\u0439\u0442\u0438 \u0438 \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0439 (\u0443\u0436\u0435 \u0437\u0434\u0435\u0441\u044c \u043f\u043e \u043f\u043e\u043b\u044e &#171;Status&#187; \u043c\u043e\u0436\u043d\u043e \u0443\u0432\u0438\u0434\u0435\u0442\u044c, \u0441 \u043a\u0430\u043a\u0438\u043c \u043a\u043e\u0434\u043e\u043c \u0432\u044b\u043f\u043e\u043b\u043d\u0438\u043b\u0441\u044f \u0437\u0430\u043f\u0440\u043e\u0441).<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/d1d\/42c\/221\/d1d42c2219f9e1f0ad224ca08dfaf186.png\" width=\"1412\" height=\"240\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d1d\/42c\/221\/d1d42c2219f9e1f0ad224ca08dfaf186.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"5\">\n<li>\n<p>\u0412 \u043e\u0442\u043a\u0440\u044b\u0432\u0448\u0435\u0439\u0441\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u043e \u0437\u0430\u043f\u0440\u043e\u0441\u0435, \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0435 &#171;Headers&#187;, \u0432 \u0431\u043b\u043e\u043a\u0435 &#171;General&#187;, \u0432 \u043f\u043e\u043b\u0435 &#171;Status Code&#187; \u0432\u0438\u0434\u043d\u043e, \u0441 \u043a\u0430\u043a\u0438\u043c \u043a\u043e\u0434\u043e\u043c \u0432\u044b\u043f\u043e\u043b\u043d\u0438\u043b\u0441\u044f \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u044b\u0439 \u0437\u0430\u043f\u0440\u043e\u0441.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/69d\/8c8\/124\/69d8c8124f12c66c29bcfe2016e93440.png\" width=\"808\" height=\"462\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/69d\/8c8\/124\/69d8c8124f12c66c29bcfe2016e93440.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"6\">\n<li>\n<p>\u0412 \u044d\u0442\u043e\u0439 \u0436\u0435 \u0432\u043a\u043b\u0430\u0434\u043a\u0435 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u044e\u0442\u0441\u044f \u0432\u0441\u0435 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0438 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u043c\u043e\u0433\u043e \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u0438 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u043d\u043e\u0433\u043e \u043e\u0442\u0432\u0435\u0442\u0430 (&#171;Request Headers&#187; \u0438 &#171;Response Headers&#187;).<\/p>\n<\/li>\n<li>\n<p>\u0412\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0435 &#171;Response&#187; \u0431\u0443\u0434\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c\u0441\u044f \u043e\u0442\u0432\u0435\u0442 \u043e\u0442 \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u043d\u0430 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u043d\u044b\u0439 \u0437\u0430\u043f\u0440\u043e\u0441 (\u043e\u0431\u044b\u0447\u043d\u043e \u043e\u0442\u0432\u0435\u0442 \u043e\u0442 \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0432 \u0444\u043e\u0440\u043c\u0430\u0442\u0435 JSON).<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/ea2\/c08\/988\/ea2c089889a8efe290305cf4876758f7.png\" width=\"1220\" height=\"648\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ea2\/c08\/988\/ea2c089889a8efe290305cf4876758f7.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>\u041c\u0430\u0440\u043a\u0438\u0440\u043e\u0432\u043a\u0430 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432 \u0441 \u043e\u0448\u0438\u0431\u043a\u043e\u0439<\/strong><\/p>\n<p>\u0412 DevTools \u043f\u043e\u0434\u0441\u0432\u0435\u0447\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u043a\u0440\u0430\u0441\u043d\u044b\u043c \u0446\u0432\u0435\u0442\u043e\u043c \u0442\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0435 \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u043b\u0438\u0441\u044c \u0438\u043b\u0438 \u0437\u0430\u043f\u0440\u043e\u0441 \u0432\u0435\u0440\u043d\u0443\u043b\u0441\u044f \u0441 \u043e\u0448\u0438\u0431\u043a\u043e\u0439.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/d85\/c8b\/1ef\/d85c8b1efbc0e607dd3a55e22f8cbe5f.png\" width=\"992\" height=\"268\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d85\/c8b\/1ef\/d85c8b1efbc0e607dd3a55e22f8cbe5f.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0427\u0442\u043e \u0435\u0449\u0451 \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0438\u0433\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u043f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 \u0432\u043a\u043b\u0430\u0434\u043a\u0438 &#171;Network&#187; \u0432 DevTools:<\/p>\n<ul>\n<li>\n<p>\u0412\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u043e\u0433\u043e \u043b\u043e\u0433\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432 (&#171;Preserve Log&#187;), \u0447\u0442\u043e\u0431\u044b \u0438\u0445 \u0441\u043f\u0438\u0441\u043e\u043a \u0432 \u0442\u0430\u0431\u043b\u0438\u0446\u0435 \u043d\u0435 \u043e\u0447\u0438\u0449\u0430\u043b\u0441\u044f \u043f\u0440\u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/14f\/935\/96e\/14f93596e7bce64e579a7070596b656d.png\" width=\"638\" height=\"118\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/14f\/935\/96e\/14f93596e7bce64e579a7070596b656d.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u041e\u0442\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043a\u044d\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0434\u043b\u044f \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0435\u043c\u044b\u0445 \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432 (&#171;Disable cache&#187;), \u0447\u0442\u043e\u0431\u044b \u0437\u0430\u043f\u0440\u0430\u0448\u0438\u0432\u0430\u0435\u043c\u044b\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437 \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u043b\u0438\u0441\u044c \u0441 \u0441\u0435\u0440\u0432\u0435\u0440\u0430, \u0430 \u043d\u0435 \u0438\u0437 \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043a\u044d\u0448\u0430.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/876\/5f3\/97f\/8765f397fa2694de881b9d253241a7d9.png\" width=\"634\" height=\"120\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/876\/5f3\/97f\/8765f397fa2694de881b9d253241a7d9.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u042d\u043c\u0443\u043b\u044f\u0446\u0438\u044f \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f (&#171;Throttling&#187;) \u0434\u043b\u044f \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u0440\u0430\u0431\u043e\u0442\u044b \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432 \u043f\u0440\u0438 \u043c\u0435\u0434\u043b\u0435\u043d\u043d\u043e\u043c \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u0438. \u0415\u0441\u0442\u044c \u043f\u0440\u0435\u0434\u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u0435 \u043f\u0440\u0435\u0441\u0435\u0442\u044b, \u043d\u043e \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0438 \u0441\u0432\u043e\u0438.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/97c\/bcd\/6e2\/97cbcd6e28cb5e6ef53940d6cc45d1e3.png\" width=\"684\" height=\"114\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/97c\/bcd\/6e2\/97cbcd6e28cb5e6ef53940d6cc45d1e3.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0424\u0438\u043b\u044c\u0442\u0440 \u0434\u043b\u044f \u0442\u0438\u043f\u043e\u0432 \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432 (\u041d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435: &#171;Fetch\/XHR&#187; \u2014 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442 Rest API \u0437\u0430\u043f\u0440\u043e\u0441\u044b, &#171;Doc&#187; \u2014 HTML-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, &#171;WS&#187; \u2014 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442 web-socket \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f).<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/011\/528\/0a8\/0115280a853f49b6f331160f1c822e6e.png\" width=\"934\" height=\"60\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/011\/528\/0a8\/0115280a853f49b6f331160f1c822e6e.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0412\u043a\u043b\u0430\u0434\u043a\u0430 &#171;Timing&#187;, \u0447\u0442\u043e\u0431\u044b \u043e\u0446\u0435\u043d\u0438\u0442\u044c \u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0443\u0448\u043b\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0443 \u0442\u043e\u0433\u043e \u0438\u043b\u0438 \u0438\u043d\u043e\u0433\u043e \u0440\u0435\u0441\u0443\u0440\u0441\u0430.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/4ff\/381\/ab1\/4ff381ab18b5fbbca8c8eb6dd0bb4836.png\" width=\"1176\" height=\"754\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/4ff\/381\/ab1\/4ff381ab18b5fbbca8c8eb6dd0bb4836.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0412\u043a\u043b\u0430\u0434\u043a\u0430 &#171;Cookie&#187;, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0432\u0438\u0434\u043d\u043e, \u043a\u0430\u043a\u0438\u0435 \u043a\u0443\u043a\u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u044e\u0442\u0441\u044f \u0441 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u043c &#171;Request Cookies&#187; (\u0438\u043b\u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u044e\u0442\u0441\u044f \u0441 \u043e\u0442\u0432\u0435\u0442\u043e\u043c &#171;Response Cookies&#187;).<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/ce7\/90c\/def\/ce790cdef0cf3bcdc43542f640bec5cf.png\" width=\"2136\" height=\"758\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ce7\/90c\/def\/ce790cdef0cf3bcdc43542f640bec5cf.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u041a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u043d\u043e\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u043e\u0439 \u043e\u0447\u0438\u0441\u0442\u043a\u0438 \u043a\u044d\u0448\u0430 \u0438 \u043a\u0443\u043a\u0438 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/46a\/855\/908\/46a855908e85136ad1cdcc82cf4c6516.png\" width=\"780\" height=\"698\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/46a\/855\/908\/46a855908e85136ad1cdcc82cf4c6516.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0411\u043b\u043e\u043a\u0438\u0440\u043e\u0432\u043a\u0430 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432 \u043f\u043e \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u043c\u0443 URL \u0438\u043b\u0438 \u0432\u0441\u0435\u0433\u043e \u0434\u043e\u043c\u0435\u043d\u0430 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e:<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/d20\/2ba\/0a3\/d202ba0a3a09de8163001003d7fb7e7d.png\" width=\"556\" height=\"710\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d20\/2ba\/0a3\/d202ba0a3a09de8163001003d7fb7e7d.png\"\/><figcaption><\/figcaption><\/figure>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/ebe\/b47\/e77\/ebeb47e7786d1f2b955eeaa53cfaade7.png\" width=\"1030\" height=\"406\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ebe\/b47\/e77\/ebeb47e7786d1f2b955eeaa53cfaade7.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0437\u0430\u043f\u0440\u043e\u0441 \u0432 \u0443\u0434\u043e\u0431\u043d\u043e\u043c \u0444\u043e\u0440\u043c\u0430\u0442\u0435, \u0434\u043e\u043f\u0443\u0441\u0442\u0438\u043c, \u0447\u0442\u043e\u0431\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u0435\u0433\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0443 (\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 CURL):<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/bda\/2cd\/224\/bda2cd2245acc104f72f9e570a52f983.png\" width=\"1126\" height=\"832\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/bda\/2cd\/224\/bda2cd2245acc104f72f9e570a52f983.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0412\u0430\u0436\u043d\u044b\u043c \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u043c \u0432 \u043f\u043e\u0438\u0441\u043a\u0435 \u043e\u0448\u0438\u0431\u043e\u043a \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0432\u044b\u0441\u0442\u0443\u043f\u0430\u0435\u0442 \u043a\u043e\u043d\u0441\u043e\u043b\u044c \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u0412\u043a\u043b\u0430\u0434\u043a\u0430 &#171;Console&#187;:<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c DevTools \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 (F12 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e).<\/p>\n<\/li>\n<li>\n<p>\u041f\u0435\u0440\u0435\u0439\u0442\u0438 \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0443 &#171;Console&#187;.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/90d\/89b\/671\/90d89b671a249bc2907a56b255b85135.png\" width=\"690\" height=\"54\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/90d\/89b\/671\/90d89b671a249bc2907a56b255b85135.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u0412 \u043e\u0442\u043a\u0440\u044b\u0432\u0448\u0435\u043c\u0441\u044f \u043e\u043a\u043d\u0435 \u0431\u0443\u0434\u0443\u0442 \u0432\u0438\u0434\u043d\u044b \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f, \u0438\u0441\u0445\u043e\u0434\u044f\u0449\u0438\u0435 \u043e\u0442 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, \u0432 \u0442\u043e\u043c \u0447\u0438\u0441\u043b\u0435 \u0438 \u043e\u0448\u0438\u0431\u043a\u0438 (\u043f\u043e\u0434\u0441\u0432\u0435\u0447\u0435\u043d\u044b \u043a\u0440\u0430\u0441\u043d\u044b\u043c \u0446\u0432\u0435\u0442\u043e\u043c).<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/c1a\/4e6\/5e1\/c1a4e65e17cd16d78535da4b0c139ee4.png\" width=\"1458\" height=\"212\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/c1a\/4e6\/5e1\/c1a4e65e17cd16d78535da4b0c139ee4.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0427\u0442\u043e \u0435\u0449\u0451 \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0438\u0433\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u043f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 \u043a\u043e\u043d\u0441\u043e\u043b\u0438 DevTools:<\/p>\n<ul>\n<li>\n<p>\u0412\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u043e\u0433\u043e \u043b\u043e\u0433\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f, \u0447\u0442\u043e\u0431\u044b \u043a\u043e\u043d\u0441\u043e\u043b\u044c \u043d\u0435 \u043e\u0447\u0438\u0449\u0430\u043b\u0430\u0441\u044c \u043f\u043e\u0441\u043b\u0435 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b (&#171;Console Settings&#187; \u2192 &#171;Preserve Log&#187;).<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/1cc\/3bf\/1d8\/1cc3bf1d8f781b84e71c5e04d50f5cd6.png\" width=\"1042\" height=\"324\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/1cc\/3bf\/1d8\/1cc3bf1d8f781b84e71c5e04d50f5cd6.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430 \u0443\u0440\u043e\u0432\u043d\u0435\u0439 \u043b\u043e\u0433\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f, \u0447\u0442\u043e\u0431\u044b \u0441\u043e\u0431\u0438\u0440\u0430\u0442\u044c \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u044c \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0448\u0438\u0431\u043a\u0438 (&#171;Log level&#187;).<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/9a0\/65b\/6b0\/9a065b6b0efc9dee87c6cf6c8224749e.png\" width=\"348\" height=\"308\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/9a0\/65b\/6b0\/9a065b6b0efc9dee87c6cf6c8224749e.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0434-\u0431\u0430\u0440 \u043a\u043e\u043d\u0441\u043e\u043b\u0438, \u0434\u043b\u044f \u0443\u0434\u043e\u0431\u0441\u0442\u0432\u0430 \u0441\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u043a\u0438 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0439 (&#171;Show console sidebar&#187;).<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/e1b\/83f\/31a\/e1b83f31a91d8049f8e59065c8b3797a.png\" width=\"320\" height=\"348\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/e1b\/83f\/31a\/e1b83f31a91d8049f8e59065c8b3797a.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u041e\u043f\u0446\u0438\u044f &#171;Show timestamps&#187; \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442 \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u0438 \u0432\u0440\u0435\u043c\u044f \u0432\u043e\u0437\u043d\u0438\u043a\u043d\u043e\u0432\u0435\u043d\u0438\u044f \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f\/\u043f\u0440\u0435\u0434\u0443\u043f\u0440\u0435\u0436\u0434\u0435\u043d\u0438\u044f\/\u043e\u0448\u0438\u0431\u043a\u0438 (&#171;Settings&#187; \u2192 &#171;Preferences&#187; \u2192 &#171;Console&#187;).<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/11a\/9fb\/344\/11a9fb34434244a3d316269edf5dd761.png\" width=\"520\" height=\"716\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/11a\/9fb\/344\/11a9fb34434244a3d316269edf5dd761.png\"\/><figcaption><\/figcaption><\/figure>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/2d8\/b4f\/c9c\/2d8b4fc9c7d4ae0f97ed6e35099ec270.png\" width=\"1288\" height=\"144\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/2d8\/b4f\/c9c\/2d8b4fc9c7d4ae0f97ed6e35099ec270.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0434\u043e\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u2014 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u044f\u044f \u0438\u043d\u0442\u0435\u0440\u043f\u0440\u0435\u0442\u0430\u0446\u0438\u044f \u043e\u0448\u0438\u0431\u043e\u043a \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0432\u043e\u0437\u043d\u0438\u043a\u0430\u0442\u044c \u043f\u0440\u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043e\u0448\u0438\u0431\u043e\u043a \u0432 Google Chrome:<\/summary>\n<div class=\"spoiler__content\">\n<ul>\n<li>\n<p><strong>ERR_NAME_NOT_RESOLVED<\/strong>\u00a0\u2014\u00a0\u043d\u0435\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0439 \u0432\u0435\u0431-\u0430\u0434\u0440\u0435\u0441<\/p>\n<\/li>\n<li>\n<p><strong>ERR_INTERNET_DISCONNECTED<\/strong>\u00a0\u2014 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e \u043d\u0435 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u043e \u043a \u0418\u043d\u0442\u0435\u0440\u043d\u0435\u0442\u0443<\/p>\n<\/li>\n<li>\n<p><strong>ERR_CONNECTION_TIMED_OUT<\/strong>\u00a0(<strong>ERR_TIMED_OUT<\/strong>) \u2014 \u0434\u043b\u044f \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u043a \u0432\u0435\u0431-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u043f\u043e\u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043b\u043e\u0441\u044c \u0441\u043b\u0438\u0448\u043a\u043e\u043c \u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438. \u0412\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u0435 \u043f\u0440\u0438\u0447\u0438\u043d\u044b: \u043b\u0438\u0431\u043e \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f \u0441\u043b\u0438\u0448\u043a\u043e\u043c \u043d\u0438\u0437\u043a\u0430\u044f, \u043b\u0438\u0431\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u043f\u044b\u0442\u0430\u0435\u0442\u0441\u044f \u043e\u0442\u043a\u0440\u044b\u0442\u044c \u0441\u043b\u0438\u0448\u043a\u043e\u043c \u043c\u043d\u043e\u0433\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u0439<\/p>\n<\/li>\n<li>\n<p><strong>ERR_CONNECTION_RESET<\/strong>\u00a0\u2014 \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u0435 \u0441\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u0439 \u0431\u044b\u043b\u043e \u043f\u0440\u0435\u0440\u0432\u0430\u043d\u043e<\/p>\n<\/li>\n<li>\n<p><strong>ERR_NETWORK_CHANGED<\/strong>\u00a0\u2014 \u043f\u0440\u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e \u043e\u0442\u043a\u043b\u044e\u0447\u0438\u043b\u043e\u0441\u044c \u043e\u0442 \u0441\u0435\u0442\u0438 \u0438\u043b\u0438 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0438\u043b\u043e\u0441\u044c \u043a \u043d\u043e\u0432\u043e\u0439<\/p>\n<\/li>\n<li>\n<p><strong>ERR_CONNECTION_REFUSED<\/strong>\u00a0\u2014 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u043d\u0435 \u043f\u043e\u0437\u0432\u043e\u043b\u0438\u043b\u0430 Chrome \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0438\u0442\u044c\u0441\u044f \u043a \u043d\u0435\u0439<\/p>\n<\/li>\n<li>\n<p><strong>ERR_CACHE_MISS<\/strong>\u00a0\u2014 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u043f\u0440\u043e\u0441\u0438\u0442 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e \u043e\u0442\u043f\u0440\u0430\u0432\u0438\u0442\u044c \u0440\u0430\u043d\u0435\u0435 \u0432\u0432\u0435\u0434\u0435\u043d\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435<\/p>\n<\/li>\n<li>\n<p><strong>ERR_EMPTY_RESPONSE<\/strong>\u00a0\u2014 \u0441\u0430\u0439\u0442 \u043d\u0435 \u043e\u0442\u043f\u0440\u0430\u0432\u0438\u043b \u0434\u0430\u043d\u043d\u044b\u0435 \u0438, \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e, \u043d\u0435\u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d<\/p>\n<\/li>\n<li>\n<p><strong>ERR_SSL_PROTOCOL_ERROR<\/strong>\u00a0\u2014 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u043e\u0442\u043f\u0440\u0430\u0432\u0438\u043b\u0430 \u0434\u0430\u043d\u043d\u044b\u0435, \u043d\u0435\u043f\u043e\u043d\u044f\u0442\u043d\u044b\u0435 \u0434\u043b\u044f Chrome<\/p>\n<\/li>\n<li>\n<p><strong>ERR_BAD_SSL_CLIENT_AUTH_CERT<\/strong>\u00a0\u2014 \u043d\u0435 \u0443\u0434\u0430\u0435\u0442\u0441\u044f \u0432\u043e\u0439\u0442\u0438 \u043d\u0430 \u0441\u0430\u0439\u0442 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0431\u0430\u043d\u043a\u0430 \u0438\u043b\u0438 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u0438) \u0438\u0437-\u0437\u0430 \u043e\u0448\u0438\u0431\u043a\u0438 \u0432 \u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u0435 \u043a\u043b\u0438\u0435\u043d\u0442\u0430<\/p>\n<\/li>\n<\/ul>\n<p>\u042d\u0442\u0438 \u043e\u0448\u0438\u0431\u043a\u0438 \u043c\u043e\u0436\u043d\u043e \u0443\u0432\u0438\u0434\u0435\u0442\u044c \u043f\u0440\u0438 \u043f\u043e\u043f\u044b\u0442\u043a\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u043c \u043e\u0442\u043a\u0440\u044b\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u0438\u043b\u0438 \u0436\u0435 \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u0438, \u043a\u043e\u0433\u0434\u0430 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u0432\u043e\u0437\u043d\u0438\u043a\u0430\u0435\u0442 \u0441 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e \u0432\u0437\u044f\u0442\u044b\u043c \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u043c\/\u0441\u0435\u0440\u0432\u0438\u0441\u043e\u043c\/\u0437\u0430\u043f\u0440\u043e\u0441\u043e\u043c. \u041f\u0440\u0438\u043c\u0435\u0440\u044b \u0442\u0430\u043a\u0438\u0445 \u043e\u0448\u0438\u0431\u043e\u043a:<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/d23\/e5a\/ff7\/d23e5aff74a94c5dfec353263916d44f.png\" width=\"442\" height=\"239\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d23\/e5a\/ff7\/d23e5aff74a94c5dfec353263916d44f.png\"\/><figcaption><\/figcaption><\/figure>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/deb\/dbb\/fdb\/debdbbfdb09384c3ecb74188ff5ca7f5.png\" width=\"1230\" height=\"348\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/deb\/dbb\/fdb\/debdbbfdb09384c3ecb74188ff5ca7f5.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041f\u043e\u043b\u043d\u044b\u0439 \u0441\u043f\u0438\u0441\u043e\u043a \u043e\u0448\u0438\u0431\u043e\u043a \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0437\u0434\u0435\u0441\u044c:\u00a0<a href=\"https:\/\/chrome:\/\/network-errors\/\">chrome:\/\/network-errors<\/a>.<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0412\u0438\u0434\u044b \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0442\u044c\u0441\u044f:<\/p>\n<ul>\n<li>\n<p>\u0424\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435<\/p>\n<\/li>\n<li>\n<p>\u0422\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 API<\/p>\n<\/li>\n<li>\n<p>\u0422\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0431\u0435\u0437\u043e\u043f\u0430\u0441\u043d\u043e\u0441\u0442\u0438<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<hr\/>\n<p><a class=\"anchor\" name=\"tehnologii\" id=\"tehnologii\"><\/a><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td data-colwidth=\"255\" width=\"255\">\n<p align=\"left\"><strong>\u041e\u0431\u043b\u0430\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0430<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"255\" width=\"255\">\n<p align=\"left\"><strong>\u041a\u043b\u0430\u0441\u0441<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0422\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0438<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"255\" width=\"255\">\n<p align=\"left\"><strong>\u041e\u0431\u044a\u0435\u043a\u0442\u044b<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212; URL-\u0430\u0434\u0440\u0435\u0441<br \/>&#8212; HTTP-\u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b<br \/>&#8212; Web-\u0441\u0435\u0440\u0432\u0435\u0440<br \/>&#8212; Frontend<br \/>&#8212; Backend<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<ul>\n<li>\n<p>\u0422\u0430\u043a \u0447\u0442\u043e \u0436\u0435 \u043d\u0430 \u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442, \u043a\u043e\u0433\u0434\u0430 \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435?\u00a0\u0412 \u044d\u0442\u043e\u043c \u0431\u043b\u043e\u043a\u0435 \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0441\u0441\u043c\u0430\u0442\u0440\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u043d\u0435\u043a\u0438\u0439 \u0441\u0440\u0435\u0434\u043d\u0435\u0441\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043f\u0440\u043e\u043e\u0431\u0440\u0430\u0437 \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u043e\u0433\u043e Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u0435\u0433\u043e \u0441\u0442\u0440\u043e\u0435\u043d\u0438\u044f \u0438 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p><strong>Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435<\/strong>\u00a0\u2014 \u043a\u043b\u0438\u0435\u043d\u0442-\u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u0441\u043e\u0441\u0442\u043e\u044f\u0449\u0435\u0435 \u0438\u0437 Frontend \u0438 Backend \u0447\u0430\u0441\u0442\u0435\u0439, \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u043a\u043e\u0442\u043e\u0440\u044b\u043c \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e\u043c \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430.<\/p>\n<\/li>\n<li>\n<p>\u0417\u0430\u0433\u043b\u044f\u043d\u0435\u043c \u0436\u0435 \u00ab\u043f\u043e\u0434 \u043a\u0430\u043f\u043e\u0442\u00bb \u0442\u0430\u043a\u043e\u0433\u043e Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f:<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>Browser \u2014 \u0442\u043e\u0447\u043a\u0430 \u0432\u0445\u043e\u0434\u0430<\/summary>\n<div class=\"spoiler__content\">\n<p>\u0420\u0430\u043d\u0435\u0435 \u0443\u0436\u0435 \u0443\u043f\u043e\u043c\u0438\u043d\u0430\u043b\u043e\u0441\u044c, \u0438\u0437 \u0447\u0435\u0433\u043e \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0431\u0440\u0430\u0443\u0437\u0435\u0440, \u043d\u043e \u043d\u0430 \u0434\u0430\u043d\u043d\u043e\u0439 \u0441\u0445\u0435\u043c\u0435 \u0431\u043e\u043b\u0435\u0435 \u043d\u0430\u0433\u043b\u044f\u0434\u043d\u043e \u043f\u043e\u043a\u0430\u0437\u0430\u043d\u043e, \u043a\u0430\u043a \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u043c\u043e\u0434\u0443\u043b\u0438 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0443\u044e\u0442 \u0434\u0440\u0443\u0433 \u0441 \u0434\u0440\u0443\u0433\u043e\u043c:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/b42\/b34\/b3d\/b42b34b3d22378598fc77ee3579fedd3.png\" width=\"700\" height=\"450\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/b42\/b34\/b3d\/b42b34b3d22378598fc77ee3579fedd3.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u043e\u043d\u044f\u0442\u044c, \u0447\u0442\u043e Web-\u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0438\u0437 \u0441\u0435\u0431\u044f \u0441\u043b\u043e\u0436\u043d\u0443\u044e \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u044e, \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u044c \u0440\u0430\u0431\u043e\u0442\u044b \u0438\u043b\u0438 \u0441\u0431\u043e\u0439 \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0432\u043b\u0438\u044f\u0442\u044c \u043d\u0430 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0443 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 \u0438 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u0439.<\/p>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>URL-\u0430\u0434\u0440\u0435\u0441 \u2014 \u043f\u0443\u0442\u044c \u0434\u043e \u0440\u0435\u0441\u0443\u0440\u0441\u0430<\/summary>\n<div class=\"spoiler__content\">\n<p><strong>URL<\/strong>\u00a0(&#171;Uniform Resource Locator&#187;) \u2014 \u044d\u0442\u043e \u0435\u0434\u0438\u043d\u044b\u0439 \u043b\u043e\u043a\u0430\u0442\u043e\u0440 \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432, \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u044f \u043f\u0443\u0442\u0438.<\/p>\n<p>\u0418 \u0432\u043e\u0442 \u0432 \u0443\u0436\u0435 \u043e\u0442\u043a\u0440\u044b\u0432\u0448\u0435\u043c\u0441\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435 \u043c\u044b \u0432\u0432\u043e\u0434\u0438\u043c \u0432 \u0430\u0434\u0440\u0435\u0441\u043d\u043e\u0439 \u0441\u0442\u0440\u043e\u043a\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0439 URL-\u0430\u0434\u0440\u0435\u0441.<\/p>\n<p>\u041f\u0440\u0435\u0436\u0434\u0435 \u0447\u0435\u043c \u043c\u044b \u043d\u0430\u0447\u043d\u0451\u043c \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u043f\u043e \u044d\u0442\u043e\u043c\u0443 \u0430\u0434\u0440\u0435\u0441\u0443, \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c, \u0438\u0437 \u0447\u0435\u0433\u043e \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0430\u0434\u0440\u0435\u0441:<\/p>\n<ol>\n<li>\n<p><strong>\u041f\u0440\u043e\u0442\u043e\u043a\u043e\u043b<\/strong>\u00a0(\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;http:\/\/&#187;, &#171;https:\/\/&#187;)<\/p>\n<\/li>\n<li>\n<p><strong>\u0414\u043e\u043c\u0435\u043d\u043d\u043e\u0435 \u0438\u043c\u044f<\/strong>\u00a0(\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;<a href=\"https:\/\/www.google.com\/\">www.google.com<\/a>&#171;)<\/p>\n<\/li>\n<li>\n<p><strong>TCP \u043f\u043e\u0440\u0442<\/strong>\u00a0(\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;:80&#187;, &#171;:443&#187;)<\/p>\n<\/li>\n<li>\n<p><strong>\u0410\u0434\u0440\u0435\u0441 \u0440\u0430\u0437\u0434\u0435\u043b\u0430 \u0438\u043b\u0438 \u0440\u0435\u0441\u0443\u0440\u0441\u0430<\/strong>\u00a0(\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;\/product\/search&#187; \u0438\u043b\u0438 &#171;\/about\/unwanted-software-policy.html&#187;)<\/p>\n<\/li>\n<li>\n<p><strong>\u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b<\/strong>\u00a0(\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;?utm_source=google&amp;hl=en-RU&amp;fg=1&#187;)<\/p>\n<\/li>\n<li>\n<p><strong>\u042f\u043a\u043e\u0440\u044c<\/strong>\u00a0(\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;#tag&#187;)<\/p>\n<\/li>\n<\/ol>\n<p>\u041d\u0435 \u0432\u0441\u0435 \u0438\u0437 \u044d\u0442\u0438\u0445 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b \u0432 URL. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, TCP-\u043f\u043e\u0440\u0442, \u0442.\u043a. \u043f\u043e\u0434\u0440\u0430\u0437\u0443\u043c\u0435\u0432\u0430\u0435\u0442\u0441\u044f, \u0447\u0442\u043e \u0440\u0430\u0431\u043e\u0442\u0430 HTTP \u0438 HTTPS \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u043e\u0432 \u0431\u0443\u0434\u0435\u0442 \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u043d\u0430 \u0438\u0445 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u043f\u043e\u0440\u0442\u0430\u0445.<\/p>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0434\u043e\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u2014 \u043f\u0440\u043e\u0447\u0438\u0435 \u043f\u043e\u043d\u044f\u0442\u0438\u044f, \u0441\u0432\u044f\u0437\u0430\u043d\u043d\u044b\u0435 \u0441 URL&#8217;\u043e\u043c:<\/p>\n<ul>\n<li>\n<p><strong>\u0421\u0441\u044b\u043b\u043a\u0430<\/strong>\u00a0(&#171;Link&#187;) \u2014 \u0441\u0438\u043d\u043e\u043d\u0438\u043c \u0434\u043b\u044f \u0442\u0430\u043a\u0438\u0445 \u043f\u043e\u043d\u044f\u0442\u0438\u0439 \u043a\u0430\u043a URL-\u0430\u0434\u0440\u0435\u0441 \u0438 Web-\u0430\u0434\u0440\u0435\u0441<\/p>\n<\/li>\n<li>\n<p><strong>\u0410\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u044b\u0439 URL<\/strong>\u00a0\u2014 \u043f\u043e\u043b\u043d\u044b\u0439 URL-\u0430\u0434\u0440\u0435\u0441 web-\u0441\u0430\u0439\u0442\u0430 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;<a href=\"https:\/\/www.google.com\/\">http:\/\/www.google.com<\/a>&#171;)<\/p>\n<\/li>\n<li>\n<p><strong>\u041e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 URL<\/strong>\u00a0\u2014 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u043f\u0443\u0442\u044c \u043a \u0440\u0430\u0437\u0434\u0435\u043b\u0443 \u0438\/\u0438\u043b\u0438 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0443 \u0432\u043d\u0443\u0442\u0440\u0438 \u0441\u0430\u0439\u0442\u0430 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;\/about\/&#187;)<\/p>\n<\/li>\n<li>\n<p><strong>\u0413\u0438\u043f\u0435\u0440\u0441\u0441\u044b\u043b\u043a\u0430<\/strong>\u00a0(&#171;Hyperlink&#187;) \u2014 \u0432 \u043e\u0442\u043b\u0438\u0447\u0438\u0435 \u043e\u0442 \u043e\u0431\u044b\u0447\u043d\u043e\u0439 \u0441\u0441\u044b\u043b\u043a\u0438 \u044d\u0442\u043e UI \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, \u043f\u0440\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u043d\u0430 \u0434\u0440\u0443\u0433\u043e\u0439 \u0430\u0434\u0440\u0435\u0441.\u00a0\u0415\u0441\u043b\u0438 \u0430\u0434\u0440\u0435\u0441 \u0432\u0435\u0434\u0451\u0442 \u043d\u0430 \u044d\u0442\u043e\u0442 \u0436\u0435 \u0441\u0430\u0439\u0442, \u0442\u043e \u044d\u0442\u043e\u00a0<u>\u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u044f\u044f \u0433\u0438\u043f\u0435\u0440\u0441\u0441\u044b\u043b\u043a\u0430<\/u>. \u0415\u0441\u043b\u0438 \u0430\u0434\u0440\u0435\u0441 \u0432\u0435\u0434\u0451\u0442 \u043d\u0430 \u0434\u0440\u0443\u0433\u043e\u0439 \u0441\u0430\u0439\u0442, \u0442\u043e \u044d\u0442\u043e \u0443\u0436\u0435\u00a0<u>\u0432\u043d\u0435\u0448\u043d\u044f\u044f \u0433\u0438\u043f\u0435\u0440\u0441\u0441\u044b\u043b\u043a\u0430<\/u>.<\/p>\n<\/li>\n<li>\n<p><strong>\u042f\u043a\u043e\u0440\u044c<\/strong>\u00a0(&#171;Anchor Link&#187;, &#171;Page Jump&#187;, &#171;Jump to&#187;) \u2014 \u044d\u0442\u043e \u043c\u0435\u0442\u043a\u0430 \u0441 \u0443\u043d\u0438\u043a\u0430\u043b\u044c\u043d\u044b\u043c \u0438\u043c\u0435\u043d\u0435\u043c, \u0441\u0441\u044b\u043b\u0430\u044e\u0449\u0430\u044f\u0441\u044f \u043d\u0430 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u043e\u0435 \u043c\u0435\u0441\u0442\u043e Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b. \u0423\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0432 \u043a\u043e\u043d\u0446\u0435 URL&#8217;\u0430, \u0438 \u043f\u0435\u0440\u0435\u0434 \u0442\u0430\u043a\u043e\u0439 \u043c\u0435\u0442\u043a\u043e\u0439 \u0441\u0442\u0430\u0432\u0438\u0442\u0441\u044f \u0441\u0438\u043c\u0432\u043e\u043b #<\/p>\n<\/li>\n<li>\n<p><strong>\u0413\u043b\u0443\u0431\u0438\u043d\u043d\u044b\u0435 \u0441\u0441\u044b\u043b\u043a\u0438<\/strong>\u00a0(&#171;Deeplink&#187;) \u2014 \u044d\u0442\u043e \u0441\u0441\u044b\u043b\u043a\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0435\u0440\u0435\u043d\u0430\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0432 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0439 \u0440\u0430\u0437\u0434\u0435\u043b \u0441\u0430\u0439\u0442\u0430 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043a \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u043c, \u0441\u043a\u0440\u044b\u0442\u044b\u043c \u0433\u0434\u0435-\u0442\u043e \u0432 \u0433\u043b\u0443\u0431\u0438\u043d\u0435 \u0441\u0430\u0439\u0442\u0430)<\/p>\n<\/li>\n<li>\n<p><strong>\u041f\u0435\u0440\u0435\u0430\u0434\u0440\u0435\u0441\u0430\u0446\u0438\u044f<\/strong>\u00a0(&#171;Redirect&#187;) \u2014 \u044d\u0442\u043e \u043f\u0435\u0440\u0435\u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0441 \u043e\u0434\u043d\u043e\u0433\u043e URL-\u0430\u0434\u0440\u0435\u0441\u0430 \u043d\u0430 \u0434\u0440\u0443\u0433\u043e\u0439 URL-\u0430\u0434\u0440\u0435\u0441<\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>HTTP, HTTPS \u2014 \u0437\u0430\u043f\u0440\u043e\u0441\u044b \u0438 \u043e\u0442\u0432\u0435\u0442\u044b<\/summary>\n<div class=\"spoiler__content\">\n<p>\u041f\u0440\u0438 \u00ab\u0432\u044b\u0437\u043e\u0432\u0435\u00bb URL-\u0430\u0434\u0440\u0435\u0441\u0430 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442\u0441\u044f \u00ab\u043e\u0431\u0449\u0435\u043d\u0438\u0435\u00bb \u043c\u0435\u0436\u0434\u0443 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u043c \u0438 Web-\u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c \u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e\u043c HTTP-\u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432 \u0438 HTTP-\u043e\u0442\u0432\u0435\u0442\u043e\u0432.<\/p>\n<p><strong>HTTP<\/strong>\u00a0(&#171;Hyper Text Transfer Protocol&#187;) \u2014 \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b \u043f\u0440\u0438\u043a\u043b\u0430\u0434\u043d\u043e\u0433\u043e \u0443\u0440\u043e\u0432\u043d\u044f \u0434\u043b\u044f \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0438 \u0434\u0430\u043d\u043d\u044b\u0445, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0449\u0438\u0439 \u043d\u0430\u0434\u0451\u0436\u043d\u043e\u0435 TCP \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u0435.<\/p>\n<p>\u0418 \u0435\u0433\u043e \u0437\u0430\u0449\u0438\u0449\u0451\u043d\u043d\u0430\u044f \u0432\u0435\u0440\u0441\u0438\u044f\u00a0<strong>HTTPS<\/strong>\u00a0(&#171;Hyper Text Transfer Protocol Secure&#187;), \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 SSL\/TLS-\u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442 \u0434\u043b\u044f \u0431\u0435\u0437\u043e\u043f\u0430\u0441\u043d\u043e\u0433\u043e \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u043a \u0441\u0430\u0439\u0442\u0443.<\/p>\n<p>\u042d\u0442\u043e\u0442 \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b \u0442\u0430\u043a\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0438 \u0432 Frontend-Backend \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0438 (\u0447\u0435\u0440\u0435\u0437 REST).<\/p>\n<p>HTTP \u2014 \u044d\u0442\u043e \u043e\u0441\u043d\u043e\u0432\u043e\u043f\u043e\u043b\u0430\u0433\u0430\u044e\u0449\u0430\u044f \u0441\u0435\u0442\u0435\u0432\u043e\u0433\u043e \u043e\u0431\u0449\u0435\u043d\u0438\u044f \u043d\u0430 \u043f\u0440\u0438\u043a\u043b\u0430\u0434\u043d\u043e\u043c \u0443\u0440\u043e\u0432\u043d\u0435.<\/p>\n<p><strong>HTTP-\u0437\u0430\u043f\u0440\u043e\u0441<\/strong>\u00a0(&#171;Request&#187;) \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437:<\/p>\n<ul>\n<li>\n<p><u>\u0421\u0442\u0440\u043e\u043a\u0438 \u0437\u0430\u043f\u0440\u043e\u0441\u0430<\/u>:<\/p>\n<ul>\n<li>\n<p>HTTP \u043c\u0435\u0442\u043e\u0434 \u2014 &#171;HTTP Method&#187;\/&#187;Request Method&#187; (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;GET&#187;, &#171;PUT&#187;, &#171;POST&#187;, &#171;HEAD&#187;, &#171;OPTION&#187;)<\/p>\n<\/li>\n<li>\n<p>\u041f\u0443\u0442\u044c \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u2014 &#171;Request Target&#187;\/&#187;Request URL&#187; (\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;<a href=\"https:\/\/www.google.com\/\">https:\/\/www.google.com\/<\/a>&#171;)<\/p>\n<\/li>\n<li>\n<p>\u0412\u0435\u0440\u0441\u0438\u044f HTTP \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u0430 \u2014 &#171;HTTP Version&#187; (\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;HTTP\/1.1&#187;)<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><u>\u0417\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u043e\u0432 \u0437\u0430\u043f\u0440\u043e\u0441\u0430<\/u>:<\/p>\n<ul>\n<li>\n<p>\u041e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a \u2014 &#171;General Headers&#187; (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;Connection&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0417\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u2014 &#171;Request Headers&#187; (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;User-Agent&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0417\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a \u0440\u0435\u0441\u0443\u0440\u0441\u0430 \u2014 &#171;Representation Headers&#187; (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;Content-Type&#187;)<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><u>\u0422\u0435\u043b\u043e \u0437\u0430\u043f\u0440\u043e\u0441\u0430<\/u>\u00a0(\u043d\u0435\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440, \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043c\u0435\u0442\u043e\u0434\u0430 &#171;POST&#187;):<\/p>\n<ul>\n<li>\n<p>\u0418\u041b\u0418 \u041e\u0434\u043d\u043e\u0440\u0435\u0441\u0443\u0440\u0441\u043d\u043e\u0435 \u0442\u0435\u043b\u043e \u2014 &#171;Single-resource body&#187; (\u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u043e\u0434\u043d\u043e\u0433\u043e \u0444\u0430\u0439\u043b\u0430 \u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430\u043c\u0438 &#171;Content-Type&#187; \u0438 &#171;Content-Lenght&#187; \u0438\u0437 &#171;Representation Headers&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0418\u041b\u0418 \u041c\u043d\u043e\u0433\u043e\u0440\u0435\u0441\u0443\u0440\u0441\u043d\u043e\u0435 \u0442\u0435\u043b\u043e \u2014 &#171;Multiple-resource body&#187; (\u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u0440\u0430\u0437\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u0447\u0430\u0441\u0442\u0435\u0439\/\u0441\u0435\u0433\u043c\u0435\u043d\u0442\u043e\u0432, \u0445\u0440\u0430\u043d\u044f\u0449\u0438\u0445 \u0441\u0432\u043e\u0439 \u0431\u0438\u0442 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438. \u041e\u0431\u044b\u0447\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432 HTML-\u0444\u043e\u0440\u043c\u0430\u0445)<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0441\u0442\u0440\u043e\u043a\u0438 \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u0438 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u043e\u0432 HTTP-\u0437\u0430\u043f\u0440\u043e\u0441\u0430:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/320\/53d\/761\/32053d761e60cf1d3bed596ea6a26b84.png\" width=\"872\" height=\"280\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/320\/53d\/761\/32053d761e60cf1d3bed596ea6a26b84.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>HTTP-\u043e\u0442\u0432\u0435\u0442<\/strong>\u00a0(&#171;Response&#187;) \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437:<\/p>\n<ul>\n<li>\n<p><u>\u0421\u0442\u0440\u043e\u043a\u0438 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f<\/u>:<\/p>\n<ul>\n<li>\n<p>\u0412\u0435\u0440\u0441\u0438\u044f HTTP \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u0430 &#171;HTTP Version&#187; (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;HTTP\/1.1&#187;)<\/p>\n<\/li>\n<li>\n<p>\u041a\u043e\u0434 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u2014 &#171;Status Code&#187; (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;404&#187;)<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u044f\u0441\u043d\u0435\u043d\u0438\u0435 \u2014 &#171;Status Text&#187; (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;Not Found&#187;)<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><u>\u0417\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u043e\u0432 \u043e\u0442\u0432\u0435\u0442\u0430<\/u>:<\/p>\n<ul>\n<li>\n<p>\u041e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a \u2014 &#171;General Headers&#187; (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;Connection&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0417\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a \u043e\u0442\u0432\u0435\u0442\u0430 \u2014 &#171;Response Headers&#187; (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;Accept-Ranges&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0417\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0438 \u0440\u0435\u0441\u0443\u0440\u0441\u0430 \u2014 &#171;Entity Headers&#187; (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;Content-Lenght&#187;)<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><u>\u0422\u0435\u043b\u043e \u043e\u0442\u0432\u0435\u0442\u0430<\/u>:<\/p>\n<ul>\n<li>\n<p>\u0418\u041b\u0418 \u041e\u0434\u043d\u043e\u0440\u0435\u0441\u0443\u0440\u0441\u043d\u043e\u0435 \u0442\u0435\u043b\u043e \u0438\u0437\u0432\u0435\u0441\u0442\u043d\u043e\u0439 \u0434\u043b\u0438\u043d\u044b \u2014 &#171;Single-resource body&#187; (\u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u043e\u0434\u043d\u043e\u0433\u043e \u0444\u0430\u0439\u043b\u0430 \u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430\u043c\u0438 &#171;Content-Type&#187; \u0438 &#171;Content-Lenght&#187; \u0438\u0437 &#171;Entity Headers&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0418\u041b\u0418 \u041e\u0434\u043d\u043e\u0440\u0435\u0441\u0443\u0440\u0441\u043d\u043e\u0435 \u0442\u0435\u043b\u043e \u043d\u0435\u0438\u0437\u0432\u0435\u0441\u0442\u043d\u043e\u0439 \u0434\u043b\u0438\u043d\u044b \u2014 &#171;Single-resource body&#187; (\u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u043e\u0434\u043d\u043e\u0433\u043e \u0444\u0430\u0439\u043b\u0430, \u0440\u0430\u0437\u0431\u0438\u0442\u043e\u0433\u043e \u043d\u0430 \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u0435 \u0447\u0430\u0441\u0442\u0438 (&#171;chunks&#187;) \u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u043e\u043c &#171;Transfer-Encoding&#187; \u0438\u0437 &#171;General Headers&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0418\u041b\u0418 \u041c\u043d\u043e\u0433\u043e\u0440\u0435\u0441\u0443\u0440\u0441\u043d\u043e\u0435 \u0442\u0435\u043b\u043e \u2014 &#171;Multiple-resource body&#187; (\u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u0440\u0430\u0437\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u0447\u0430\u0441\u0442\u0435\u0439\/\u0441\u0435\u0433\u043c\u0435\u043d\u0442\u043e\u0432, \u0445\u0440\u0430\u043d\u044f\u0449\u0438\u0445 \u0441\u0432\u043e\u0439 \u0431\u0438\u0442 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0440\u0435\u0434\u043a\u043e)<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0441\u0442\u0440\u043e\u043a\u0438 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u0438 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u043e\u0432 HTTP-\u043e\u0442\u0432\u0435\u0442\u0430:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/af7\/17d\/6b6\/af717d6b6bcf4445a3f7e015265dad72.png\" width=\"805\" height=\"344\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/af7\/17d\/6b6\/af717d6b6bcf4445a3f7e015265dad72.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>Host, DNS, CDN, Web-Server \u2014 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e\u0441\u0442\u044c \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432<\/summary>\n<div class=\"spoiler__content\">\n<p>\u041f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e, \u043a\u0430\u043a \u043c\u044b \u00ab\u0441\u043e\u043e\u0431\u0449\u0438\u043b\u0438\u00bb \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0443 \u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u043f\u0435\u0440\u0435\u0439\u0442\u0438 \u043f\u043e \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u043e\u043c\u0443 URL-\u0430\u0434\u0440\u0435\u0441\u0443, \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u0440\u0438\u043c\u0435\u0440\u043d\u043e \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u0435:<\/p>\n<ul>\n<li>\n<p>\u0421 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 \u0437\u0430\u043f\u0440\u043e\u0441 \u043d\u0430 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443 \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0433\u043e \u0438\u043c\u0435\u043d\u0438 \u0438\u0437 URL&#8217;\u0430.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u0441\u043b\u0435 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 URL \u0432\u044b\u044f\u0441\u043d\u044f\u0435\u0442\u0441\u044f, \u0437\u0430 \u043a\u0430\u043a\u0438\u043c IP-\u0430\u0434\u0440\u0435\u0441\u043e\u043c \u00ab\u0437\u0430\u043a\u0440\u0435\u043f\u043b\u0435\u043d\u043e\u00bb \u044d\u0442\u043e \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0435 \u0438\u043c\u044f.<\/p>\n<\/li>\n<li>\n<p>\u0423\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u0435 \u0441 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c, \u0433\u0434\u0435 \u0445\u0440\u0430\u043d\u044f\u0442\u0441\u044f \u0440\u0435\u0441\u0443\u0440\u0441\u044b Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043f\u043e TCP (Transmission Control Protocol).<\/p>\n<\/li>\n<li>\n<p>\u041e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f HTTP-\u0437\u0430\u043f\u0440\u043e\u0441 \u043d\u0430 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041e\u0436\u0438\u0434\u0430\u0435\u0442\u0441\u044f \u043e\u0442\u0432\u0435\u0442.<\/p>\n<\/li>\n<li>\n<p>\u0421\u0435\u0440\u0432\u0435\u0440 \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442 \u0437\u0430\u043f\u0440\u043e\u0441 \u0438 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 \u043e\u0442\u0432\u0435\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e.<\/p>\n<\/li>\n<li>\n<p>\u0418 \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u0435\u043f\u0435\u0440\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u044e\u0442\u0441\u044f \u0437\u0430\u043f\u0440\u043e\u0448\u0435\u043d\u043d\u044b\u0435 \u043f\u043e \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u043e\u043c\u0443 URL&#8217;\u0443 \u0434\u0430\u043d\u043d\u044b\u0435.<\/p>\n<\/li>\n<\/ul>\n<h4>DNS-Server, Hosting Server, Web-Server<\/h4>\n<p>\u0414\u043e\u043c\u0435\u043d\u043d\u043e\u0435 \u0438\u043c\u044f, \u043f\u043e \u043a\u043e\u0442\u043e\u0440\u043e\u043c\u0443 \u0431\u0443\u0434\u0435\u0442 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b Web-\u0440\u0435\u0441\u0443\u0440\u0441\u044b, \u044d\u0442\u043e \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u0440\u0430\u0437\u0433\u043e\u0432\u043e\u0440. \u041d\u043e \u0434\u043b\u044f \u043a\u0440\u0430\u0442\u043a\u043e\u0441\u0442\u0438 \u0441\u0442\u043e\u0438\u0442 \u0443\u043f\u043e\u043c\u044f\u043d\u0443\u0442\u044c, \u0447\u0442\u043e:<\/p>\n<ul>\n<li>\n<p>\u0427\u0442\u043e\u0431\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043d\u043e\u0432\u043e\u0435 \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0435 \u0438\u043c\u044f, \u0435\u0433\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0437\u0430\u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c (\u0447\u0435\u0440\u0435\u0437 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0442\u043e\u0440 \u0434\u043e\u043c\u0435\u043d\u043d\u044b\u0445 \u0438\u043c\u0451\u043d).<\/p>\n<\/li>\n<li>\n<p>\u0417\u0430 \u043a\u0430\u0436\u0434\u044b\u043c \u0434\u043e\u043c\u0435\u043d\u043d\u044b\u043c \u0438\u043c\u0435\u043d\u0435\u043c \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0437\u0430\u043a\u0440\u0435\u043f\u043b\u0435\u043d \u0432\u043d\u0435\u0448\u043d\u0438\u0439 IP-\u0430\u0434\u0440\u0435\u0441 (\u0434\u043b\u044f \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u043f\u043e \u0441\u0435\u0442\u0438 \u0438\u043d\u0442\u0435\u0440\u043d\u0435\u0442).<\/p>\n<\/li>\n<li>\n<p>\u041d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0441\u0442\u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0443 \u043d\u0430 \u0445\u043e\u0441\u0442\u0438\u043d\u0433\u0435, \u0447\u0442\u043e\u0431\u044b \u043f\u043e \u0437\u0430\u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u043c\u0443 \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u043c\u0443 \u0438\u043c\u0435\u043d\u0438 \u0431\u044b\u043b\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b Web-\u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0445\u0440\u0430\u043d\u044f\u0449\u0438\u0435\u0441\u044f \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435.<\/p>\n<\/li>\n<\/ul>\n<p><strong>DNS-\u0441\u0435\u0440\u0432\u0435\u0440<\/strong>\u00a0(&#171;Domain Name System Server&#187;, &#171;DNS Server&#187;) \u2014 \u044d\u0442\u043e \u0441\u0435\u0440\u0432\u0435\u0440, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0445\u0440\u0430\u043d\u0438\u0442 IP-\u0430\u0434\u0440\u0435\u0441\u0430 \u0434\u043b\u044f \u0434\u043e\u043c\u0435\u043d\u043d\u044b\u0445 \u0438\u043c\u0451\u043d \u0438 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u044d\u0442\u0438 \u0434\u0430\u043d\u043d\u044b\u0435 \u043f\u043e \u0437\u0430\u043f\u0440\u043e\u0441\u0443. \u041e\u0442\u0432\u0435\u0447\u0430\u0435\u0442 \u0437\u0430 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443\/\u0441\u043e\u043f\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0433\u043e \u0438\u043c\u0435\u043d\u0438 \u043a IP-\u0430\u0434\u0440\u0435\u0441\u0443 \u0438 \u043d\u0430\u043e\u0431\u043e\u0440\u043e\u0442.<\/p>\n<p><strong>\u0425\u043e\u0441\u0442\u0438\u043d\u0433 \u0441\u0435\u0440\u0432\u0435\u0440<\/strong>\u00a0(&#171;Hosting Server&#187;) \u2014 \u044d\u0442\u043e \u0441\u0435\u0440\u0432\u0435\u0440, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043a\u0430\u043a \u0443\u0441\u043b\u0443\u0433\u0430, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0431\u0443\u0434\u0443\u0442 \u0440\u0430\u0437\u043c\u0435\u0449\u0430\u0442\u044c\u0441\u044f \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 Web-\u0440\u0435\u0441\u0443\u0440\u0441\u044b, \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0435 \u043f\u043e \u0441\u0435\u0442\u0438 \u0438\u043d\u0442\u0435\u0440\u043d\u0435\u0442. \u041e\u0431\u044b\u0447\u043d\u043e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0438\u0437 \u0441\u0435\u0431\u044f \u043d\u0430\u0431\u043e\u0440 hardware \u043e\u0441\u043d\u0430\u0449\u0451\u043d\u043d\u043e\u0433\u043e \u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u0433\u043e \u043e\u0431\u043e\u0440\u0443\u0434\u043e\u0432\u0430\u043d\u0438\u044f, \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u0439 \u0432 \u0441\u0442\u043e\u0439\u043a\u0430\u0445 \u0438\u043b\u0438 \u0448\u043a\u0430\u0444\u0430\u0445, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u043d\u0430\u044f \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u043e\u043d\u043d\u0430\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u0430 \u0438\u043b\u0438 \u0441\u0438\u0441\u0442\u0435\u043c\u0430 \u0432\u0438\u0440\u0442\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438. \u0412\u0441\u0451 \u044d\u0442\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043f\u043e\u0434 \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435\u043c \u043e\u0431\u0449\u0435\u0439 \u0431\u0438\u043b\u043b\u0438\u043d\u0433\u043e\u0432\u043e\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u044b \u0438 \u043f\u0440\u043e\u0447\u0438\u043c\u0438 \u0441\u0438\u0441\u0442\u0435\u043c\u0430\u043c\u0438 \u043c\u043e\u043d\u0438\u0442\u043e\u0440\u0438\u043d\u0433\u0430.<\/p>\n<p>\u0425\u043e\u0441\u0442\u0438\u043d\u0433\u0438 \u0431\u044b\u0432\u0430\u044e\u0442:<\/p>\n<ul>\n<li>\n<p>\u0412\u0438\u0440\u0442\u0443\u0430\u043b\u044c\u043d\u044b\u0439 (&#171;Shared&#187;) \u2014 \u043e\u0434\u0438\u043d \u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u0441\u0435\u0440\u0432\u0435\u0440, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u0432\u0438\u0440\u0442\u0443\u0430\u043b\u044c\u043d\u044b\u0445 \u043e\u0442 \u0440\u0430\u0437\u043d\u044b\u0445 \u0432\u043b\u0430\u0434\u0435\u043b\u044c\u0446\u0435\u0432.<\/p>\n<\/li>\n<li>\n<p>\u0412\u0438\u0440\u0442\u0443\u0430\u043b\u044c\u043d\u044b\u0439 \u0432\u044b\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0439 &#171;VPS\/VDS&#187; (&#171;Virtual Private Server&#187;, &#171;Virtual Dedicated Server&#187;) \u2014 \u0432 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043e\u0442\u0432\u043e\u0434\u0438\u0442\u0441\u044f \u0447\u0430\u0441\u0442\u044c \u0443\u0434\u0430\u043b\u0435\u043d\u043d\u043e\u0433\u043e \u0441\u0435\u0440\u0432\u0435\u0440\u0430.<\/p>\n<\/li>\n<li>\n<p>\u0412\u044b\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0439 (&#171;Dedicated&#187;) \u2014 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u0443\u0434\u0430\u043b\u0435\u043d\u043d\u044b\u0439 \u0441\u0435\u0440\u0432\u0435\u0440, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043f\u043e\u0434 \u043f\u043e\u043b\u043d\u044b\u043c \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435\u043c \u0432\u043b\u0430\u0434\u0435\u043b\u044c\u0446\u0430 \u0440\u0430\u0437\u043c\u0435\u0449\u0430\u0435\u043c\u044b\u0445 Web-\u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432.<\/p>\n<\/li>\n<li>\n<p>\u041e\u0431\u043b\u0430\u0447\u043d\u044b\u0439 (&#171;Cloud&#187;) \u2014 \u0444\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0441\u0445\u043e\u0436 \u0441 VPS\/VDS, \u043e\u0434\u043d\u0430\u043a\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u0432.<\/p>\n<\/li>\n<\/ul>\n<p>\u041d\u0430 \u044d\u0442\u043e\u0439 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0435 \u0432\u0438\u0434\u043d\u043e, \u043f\u043e \u043a\u0430\u043a\u043e\u0439 \u0441\u0445\u0435\u043c\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043e\u0431\u0440\u0430\u0449\u0435\u043d\u0438\u0435 \u043e\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043a \u0445\u043e\u0441\u0442\u0438\u043d\u0433 \u0441\u0435\u0440\u0432\u0435\u0440\u0443, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0440\u0430\u0437\u043c\u0435\u0449\u0430\u044e\u0442\u0441\u044f \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u043d\u0430\u0448\u0435\u0433\u043e \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u043e\u0433\u043e Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/ba1\/235\/ec0\/ba1235ec0b53df7b06eb79a1d7f07f1e.png\" width=\"800\" height=\"612\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ba1\/235\/ec0\/ba1235ec0b53df7b06eb79a1d7f07f1e.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>Web-\u0441\u0435\u0440\u0432\u0435\u0440<\/strong>\u00a0(&#171;Web-Server&#187;) \u2014 \u044d\u0442\u043e \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u043d\u044b\u0439 \u0441\u0435\u0440\u0432\u0435\u0440, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 Web-\u0440\u0435\u0441\u0443\u0440\u0441\u0430\u043c\u0438, \u043e\u0442\u0432\u0435\u0447\u0430\u0435\u0442 \u043d\u0430 HTTP-\u0437\u0430\u043f\u0440\u043e\u0441\u044b, \u043c\u043e\u0436\u0435\u0442 \u0432\u044b\u0441\u0442\u0443\u043f\u0430\u0442\u044c \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0440\u043e\u043a\u0441\u0438, \u0438\u043c\u0435\u0442\u044c \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u043d\u044b\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u044f \u0438 \u0430\u0434\u043c\u0438\u043d\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u044d\u0442\u0438\u0445 Web-\u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432.<\/p>\n<p>\u0417\u0430\u0447\u0430\u0441\u0442\u0443\u044e, \u043f\u043e\u0434 \u043f\u043e\u043d\u044f\u0442\u0438\u0435 Web-\u0441\u0435\u0440\u0432\u0435\u0440 \u043f\u043e\u0434\u043f\u0430\u0434\u0430\u0435\u0442 \u0431\u043e\u043b\u0435\u0435 \u0448\u0438\u0440\u043e\u043a\u0438\u0439 \u0441\u043f\u0435\u043a\u0442\u0440 \u043f\u043e\u043d\u044f\u0442\u0438\u0439, \u0432\u043a\u043b\u044e\u0447\u0430\u044f \u0432 \u044d\u0442\u043e\u0442 \u0441\u043f\u0438\u0441\u043e\u043a \u0438 \u0441\u0430\u043c\u043e \u00ab\u0436\u0435\u043b\u0435\u0437\u043e\u00bb, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 HTTP-\u0441\u0435\u0440\u0432\u0435\u0440.<\/p>\n<p>\u041d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u0435 Web-\u0441\u0435\u0440\u0432\u0435\u0440\u0430 (HTTP-\u0441\u0435\u0440\u0432\u0435\u0440\u0430):<\/p>\n<ul>\n<li>\n<p>Apache<\/p>\n<\/li>\n<li>\n<p>Nginx<\/p>\n<\/li>\n<li>\n<p>Microsoft IIS (Internet Information Services)<\/p>\n<\/li>\n<li>\n<p>Google Web Server<\/p>\n<\/li>\n<li>\n<p>Glassfish<\/p>\n<\/li>\n<\/ul>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043d\u0430\u0433\u043b\u044f\u0434\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u043c\u0435\u0440\u0430 \u2014 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0430 \u0441 web-\u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u043e\u043c \u0430\u0434\u043c\u0438\u043d\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f Glassfish Web-\u0441\u0435\u0440\u0432\u0435\u0440\u0430. \u042d\u0442\u0430 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0430, \u0440\u0430\u0437\u0443\u043c\u0435\u0435\u0442\u0441\u044f, \u043d\u0435 \u0434\u0430\u0451\u0442 \u0432\u0441\u0435\u0445 \u043e\u0442\u0432\u0435\u0442\u043e\u0432 \u043e \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044f\u0445 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a Web-\u0441\u0435\u0440\u0432\u0435\u0440\u043e\u0432, \u043d\u043e \u043e\u043d\u0430 \u043e\u0442\u043b\u0438\u0447\u043d\u043e \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u0438\u0445 \u043e\u0445\u0432\u0430\u0442:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/1a9\/516\/bf6\/1a9516bf6a3e5fbc3e5cd1405ce640a7.png\" width=\"885\" height=\"734\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/1a9\/516\/bf6\/1a9516bf6a3e5fbc3e5cd1405ce640a7.png\"\/><figcaption><\/figcaption><\/figure>\n<h4>CDN \u2014 Content Delivery Network<\/h4>\n<p>\u041d\u043e \u0447\u0442\u043e \u0434\u0435\u043b\u0430\u0442\u044c, \u0435\u0441\u043b\u0438 \u0441\u0435\u0440\u0432\u0435\u0440 \u0441 Web-\u0440\u0435\u0441\u0443\u0440\u0441\u0430\u043c\u0438 \u0443 \u043d\u0430\u0441 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432 \u043e\u0434\u043d\u043e\u043c \u0433\u0435\u043e, \u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0438 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u044e\u0442\u0441\u044f \u0441 \u0434\u0440\u0443\u0433\u043e\u0433\u043e? \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441\u0435\u0440\u0432\u0435\u0440 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d \u0432 \u0415\u0432\u0440\u043e\u043f\u0435, \u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0438 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u044e\u0442\u0441\u044f \u0438\u0437 \u041b\u0430\u0442\u0438\u043d\u0441\u043a\u043e\u0439 \u0410\u043c\u0435\u0440\u0438\u043a\u0438 \u0438\u043b\u0438 \u041e\u043a\u0435\u0430\u043d\u0438\u0438. \u0414\u043b\u044f \u0442\u0430\u043a\u0438\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u0439 \u043e\u0431\u0440\u0430\u0449\u0435\u043d\u0438\u0435 \u0437\u0430 Web-\u0440\u0435\u0441\u0443\u0440\u0441\u0430\u043c\u0438 \u0431\u0443\u0434\u0435\u0442 \u0443\u0442\u043e\u043c\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0434\u043e\u043b\u0433\u0438\u043c \u0438 \u043d\u0435\u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u044b\u043c.<\/p>\n<p>\u0414\u043b\u044f \u0440\u0435\u0448\u0435\u043d\u0438\u044f \u044d\u0442\u043e\u0433\u043e \u0432\u043e\u043f\u0440\u043e\u0441\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0441\u0445\u0435\u043c\u0430 \u0441 CDN.<\/p>\n<p><strong>CDN<\/strong>\u00a0(&#171;Content Delivery Network&#187;) \u2014 \u044d\u0442\u043e \u0433\u0435\u043e\u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0438 \u0440\u0430\u0441\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u0430\u044f \u0441\u0435\u0442\u0435\u0432\u0430\u044f \u0438\u043d\u0444\u0440\u0430\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430, \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u044e\u0449\u0430\u044f \u0431\u044b\u0441\u0442\u0440\u0443\u044e \u0434\u043e\u0441\u0442\u0430\u0432\u043a\u0443 \u0434\u043e\u0441\u0442\u0430\u0432\u043a\u0443 Web-\u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432.<\/p>\n<p>CDN \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437:<\/p>\n<ul>\n<li>\n<p>Origin \u2014 \u0441\u0435\u0440\u0432\u0435\u0440\u0430, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0445\u0440\u0430\u043d\u044f\u0442\u0441\u044f \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u0435 Web-\u0440\u0435\u0441\u0443\u0440\u0441\u044b, \u0440\u0430\u0437\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0435 \u0447\u0435\u0440\u0435\u0437 CDN.<\/p>\n<\/li>\n<li>\n<p>PoP (&#171;Point of Presence&#187;), Edge \u2014 \u043a\u044d\u0448\u0438\u0440\u0443\u044e\u0449\u0435\u0433\u043e \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u0432 \u0441\u043e\u0441\u0442\u0430\u0432\u0435 CDN, \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u043d\u043e\u0433\u043e \u0432 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u043e\u0439 \u0433\u0435\u043e\u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u043b\u043e\u043a\u0430\u0446\u0438\u0438.<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0438 \u0438\u0437 \u0440\u0430\u0437\u043d\u044b\u0445 \u0433\u0435\u043e \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u044e\u0442\u0441\u044f \u043a \u0431\u043b\u0438\u0436\u0430\u0439\u0448\u0435\u043c\u0443 \u043a \u043d\u0438\u043c Edge \u0441\u0435\u0440\u0432\u0435\u0440\u0443 \u0438 \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u044e\u0442 Web-\u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0441 \u044d\u0442\u043e\u0433\u043e \u0441\u0435\u0440\u0432\u0435\u0440\u0430.<\/p>\n<p>\u041a\u0430\u0440\u0442\u0438\u043d\u043a\u0430, \u044f\u0440\u043a\u043e \u0434\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0438\u0440\u0443\u044e\u0449\u0430\u044f \u0440\u0430\u0437\u043d\u0438\u0446\u0443 \u043f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u0441\u0445\u0435\u043c \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u043a Origin \u0441\u0435\u0440\u0432\u0435\u0440\u0443 \u2014 \u0431\u0435\u0437 CDN \u0438 \u0441 CDN \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/66b\/954\/999\/66b9549997faf0c30a44e341bb96be05.png\" width=\"1024\" height=\"647\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/66b\/954\/999\/66b9549997faf0c30a44e341bb96be05.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0418 \u0435\u0449\u0451 \u043e\u0434\u043d\u043e \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0440\u0430\u0431\u043e\u0442\u044b CDN \u0434\u043b\u044f \u0437\u0430\u043a\u0440\u0435\u043f\u043b\u0435\u043d\u0438\u044f:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/877\/837\/065\/8778370651e70ef2295b68c2e64c063e.png\" width=\"800\" height=\"500\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/877\/837\/065\/8778370651e70ef2295b68c2e64c063e.png\"\/><figcaption><\/figcaption><\/figure>\n<h3>TCP\/IP<\/h3>\n<p>\u0412\u0441\u0451 \u0436\u0435 \u0441\u0442\u043e\u0438\u0442 \u0432\u043a\u0440\u0430\u0442\u0446\u0435 \u0443\u043f\u043e\u043c\u044f\u043d\u0443\u0442\u044c \u0438 \u043f\u0440\u043e \u0441\u0442\u0435\u043a \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u043e\u0432 TCP\/IP, \u043c\u043e\u0434\u0435\u043b\u044c \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043f\u0440\u0438 \u043e\u0431\u043c\u0435\u043d\u0435 \u043a\u043b\u0438\u0435\u043d\u0442\u0430 \u0438 \u0441\u0435\u0440\u0432\u0435\u0440\u0430.<\/p>\n<p>\u0421\u0435\u0442\u0435\u0432\u0430\u044f \u043c\u043e\u0434\u0435\u043b\u044c \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442 \u043f\u0440\u043e\u0446\u0435\u0441\u0441 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0438 \u0446\u0438\u0444\u0440\u043e\u0432\u044b\u0445 \u0434\u0430\u043d\u043d\u044b\u0445: \u043f\u043e \u043a\u0430\u043a\u0438\u043c \u0443\u0440\u043e\u0432\u043d\u044f\u043c \u043f\u0440\u043e\u0445\u043e\u0434\u044f\u0442 \u0434\u0430\u043d\u043d\u044b\u0435, \u043a\u0430\u043a\u0438\u0435 \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u044b \u0437\u0430\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u043d\u044b \u043d\u0430 \u0440\u0430\u0437\u043d\u044b\u0445 \u0443\u0440\u043e\u0432\u043d\u044f\u0445.<\/p>\n<p>\u0417\u0430 \u0435\u0434\u0438\u043d\u0438\u0446\u0443 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u0432 \u0441\u0435\u0442\u0438 \u043f\u0440\u0438\u043d\u044f\u0442\u043e \u0441\u0447\u0438\u0442\u0430\u0442\u044c \u043f\u0430\u043a\u0435\u0442.<\/p>\n<p><strong>\u041f\u0430\u043a\u0435\u0442<\/strong>\u00a0(&#171;Network packet&#187;, &#171;Packet&#187;) \u2014 \u044d\u0442\u043e \u043e\u0444\u043e\u0440\u043c\u043b\u0435\u043d\u043d\u044b\u0439 \u0431\u043b\u043e\u043a \u0434\u0430\u043d\u043d\u044b\u0445, \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0439 \u043f\u043e \u0441\u0435\u0442\u0438.<\/p>\n<p>\u041f\u0430\u043a\u0435\u0442\u044b \u0441\u043e\u0441\u0442\u043e\u044f\u0442 \u0438\u0437:<\/p>\n<ul>\n<li>\n<p>\u0412\u0435\u0440\u0441\u0438\u0438 \u043f\u0430\u043a\u0435\u0442\u0430 (IPv4, IPv6)<\/p>\n<\/li>\n<li>\n<p>\u0417\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430 (\u0433\u0440\u0430\u043d\u0438\u0446\u0430, \u043e\u0442 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043d\u0430\u0447\u0438\u043d\u0430\u044e\u0442\u0441\u044f \u0434\u0430\u043d\u043d\u044b\u0435)<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442\u0430 \u043f\u0430\u043a\u0435\u0442\u0430 (QoS \u2014 &#171;Quality of Service&#187;, ToS \u2014 &#171;Type of Service&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0414\u043b\u0438\u043d\u044b\/\u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u043f\u0430\u043a\u0435\u0442\u0430 (\u0432 \u0431\u0430\u0439\u0442\u0430\u0445, \u0434\u0430\u043d\u043d\u044b\u0435 + \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a)<\/p>\n<\/li>\n<li>\n<p>\u0422\u044d\u0433\u0430 (\u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430)<\/p>\n<\/li>\n<li>\n<p>\u0424\u043b\u0430\u0433\u0430 (\u0444\u0440\u0430\u0433\u043c\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u0438\u043b\u0438 \u043d\u0435 \u0444\u0440\u0430\u0433\u043c\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u043f\u0430\u043a\u0435\u0442)<\/p>\n<\/li>\n<li>\n<p>\u0421\u043c\u0435\u0449\u0435\u043d\u0438\u044f \u0444\u0440\u0430\u0433\u043c\u0435\u043d\u0442\u0430 (&#171;Fragment Offset&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0412\u0440\u0435\u043c\u0435\u043d\u0438 \u0436\u0438\u0437\u043d\u0438 (TTL \u2014 &#171;Time to Live&#187;)<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u0430 (TCP \u2014 &#171;Traffic Control Protocol&#187;, UDP \u2014 &#171;User Datagram Protocol&#187;, ICMP \u2014 &#171;Internet Control Message Protocol&#187; \u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u0438\u0435)<\/p>\n<\/li>\n<li>\n<p>\u041a\u043e\u043d\u0442\u0440\u043e\u043b\u044c\u043d\u043e\u0439 \u0441\u0443\u043c\u043c\u044b \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430 (&#171;Header Checksum&#187;)<\/p>\n<\/li>\n<li>\n<p>IP-\u0430\u0434\u0440\u0435\u0441\u0430 \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u0430<\/p>\n<\/li>\n<li>\n<p>IP-\u0430\u0434\u0440\u0435\u0441\u0430 \u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f<\/p>\n<\/li>\n<\/ul>\n<p>\u0421\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u0435 \u0443\u0440\u043e\u0432\u043d\u0435\u0439 \u0434\u0432\u0443\u0445 \u0441\u0430\u043c\u044b\u0445 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u0445 \u043a\u043e\u043d\u0446\u0435\u043f\u0446\u0438\u0439 \u0441\u0435\u0442\u0435\u0432\u044b\u0445 \u043c\u043e\u0434\u0435\u043b\u0435\u0439:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/4ae\/7b0\/565\/4ae7b0565e5fade52c3631eb149e0f41.png\" width=\"1500\" height=\"580\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/4ae\/7b0\/565\/4ae7b0565e5fade52c3631eb149e0f41.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u044b \u0438 \u0441\u0440\u0435\u0434\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 \u043d\u0430 \u0440\u0430\u0437\u043d\u044b\u0445 \u0443\u0440\u043e\u0432\u043d\u044f\u0445 \u043c\u043e\u0434\u0435\u043b\u0438 TCP\/IP:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/9ff\/29c\/b8b\/9ff29cb8bcdd0461535e8ef8172b1c83.png\" width=\"1536\" height=\"810\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/9ff\/29c\/b8b\/9ff29cb8bcdd0461535e8ef8172b1c83.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041f\u043e\u0434\u0432\u043e\u0434\u044f \u0447\u0435\u0440\u0442\u0443 \u043f\u043e\u0434 \u044d\u0442\u0438\u043c \u0431\u043b\u043e\u043a\u043e\u043c, \u0445\u043e\u0447\u0435\u0442\u0441\u044f \u0441\u043a\u0430\u0437\u0430\u0442\u044c, \u0447\u0442\u043e, \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u0433\u043e\u0432\u043e\u0440\u0438\u043c \u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0438 \u00ab\u043a\u043b\u0438\u0435\u043d\u0442-\u0441\u0435\u0440\u0432\u0435\u0440\u00bb, \u0442\u043e \u043f\u043e\u0434\u0440\u0430\u0437\u0443\u043c\u0435\u0432\u0430\u0435\u043c \u043e\u0431\u0449\u0435\u043d\u0438\u0435 Frontend \u0438 Backend \u0447\u0430\u0441\u0442\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f (\u0445\u043e\u0442\u044f \u0432 \u0431\u043e\u043b\u044c\u0448\u0438\u043d\u0441\u0442\u0432\u0435 \u0441\u043b\u0443\u0447\u0430\u0435\u0432 \u043f\u043e\u0434 \u044d\u0442\u043e \u043f\u043e\u043d\u044f\u0442\u0438\u0435 \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0434\u043f\u0430\u0434\u0430\u0442\u044c \u043e\u0431\u0449\u0435\u043d\u0438\u0435 Web-\u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u2014 Web-\u0441\u0435\u0440\u0432\u0435\u0440).\u00a0<br \/>\u041d\u043e \u0432\u0430\u0436\u043d\u043e \u043f\u043e\u043d\u0438\u043c\u0430\u0442\u044c, \u0447\u0442\u043e \u043d\u0430 \u043f\u0443\u0442\u0438 \u043a \u044d\u0442\u043e\u043c\u0443 \u043e\u0431\u0449\u0435\u043d\u0438\u044e \u0441\u0442\u043e\u0438\u0442 \u0432\u0435\u0440\u0435\u043d\u0438\u0446\u0430 \u0434\u0440\u0443\u0433\u0438\u0445 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u0432, \u043d\u0430\u0447\u0438\u043d\u0430\u044f \u043e\u0442 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u0432 \u043d\u0430 \u0441\u0435\u0442\u0438 \u043f\u0440\u043e\u0432\u0430\u0439\u0434\u0435\u0440\u0430, \u0437\u0430\u043a\u0430\u043d\u0447\u0438\u0432\u0430\u044f \u0441\u0435\u0440\u0432\u0435\u0440\u0430\u043c\u0438 \u043d\u0430 \u0445\u043e\u0441\u0442\u0438\u043d\u0433\u0435. \u0410 \u043f\u043e\u043c\u0438\u043c\u043e \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u0432 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u043e\u0433\u0440\u043e\u043c\u043d\u044b\u0439 \u00ab\u0437\u043e\u043e\u043f\u0430\u0440\u043a\u00bb \u0438\u0437 \u0441\u0435\u0442\u0435\u0432\u043e\u0433\u043e \u043e\u0431\u043e\u0440\u0443\u0434\u043e\u0432\u0430\u043d\u0438\u044f L2\/L3 \u0443\u0440\u043e\u0432\u043d\u0435\u0439 \u0441\u043e \u0441\u0432\u043e\u0438\u043c\u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u043c\u0438, \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043a\u0430\u043c\u0438 \u0438&#8230; \u0412\u043f\u0440\u043e\u0447\u0435\u043c, \u044d\u0442\u043e \u0443\u0436\u0435 \u0441\u043e\u0432\u0441\u0435\u043c \u0434\u0440\u0443\u0433\u0430\u044f \u0438\u0441\u0442\u043e\u0440\u0438\u044f \ud83d\ude42<\/p>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>Frontend \u2014 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u0439 \u043a\u043e\u0434 (DOM, HTML, CSS, JS, Media, WebGL &#8230;)<\/summary>\n<div class=\"spoiler__content\">\n<p>\u0418 \u0432\u043e\u0442 \u043c\u044b \u0434\u043e\u0448\u043b\u0438 \u0434\u043e \u043c\u043e\u043c\u0435\u043d\u0442\u0430, \u043a\u043e\u0433\u0434\u0430 (\u0447\u0435\u0440\u0435\u0437 \u0442\u0435\u0440\u043d\u0438\u0438 \u0441\u0435\u0442\u0435\u0432\u044b\u0445 \u0445\u0438\u0442\u0440\u043e\u0441\u043f\u043b\u0435\u0442\u0435\u043d\u0438\u0439) Web-\u0441\u0435\u0440\u0432\u0435\u0440 \u043d\u0430\u043c \u0432\u0435\u0440\u043d\u0443\u043b \u0441\u0442\u0430\u0442\u0443\u0441 200 (&#171;OK&#187;) \u043d\u0430 \u0437\u0430\u043f\u0440\u043e\u0441 \u043f\u043e \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u043e\u043c\u0443 URL-\u0430\u0434\u0440\u0435\u0441\u0443, \u0447\u0442\u043e \u0436\u0435 \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442\u044c \u0434\u0430\u043b\u044c\u0448\u0435?<\/p>\n<p>\u0410 \u0434\u0430\u043b\u044c\u0448\u0435 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u00ab\u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u0435\u00bb \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u0434\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043c\u043e\u0433 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0441 \u043d\u0430\u0448\u0438\u043c \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u044b\u043c Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c.<\/p>\n<p>\u041f\u0440\u0438 \u044d\u0442\u043e\u043c \u0438\u043d\u0438\u0446\u0438\u0430\u0442\u043e\u0440\u043e\u043c HTTP-\u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432 \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0441\u0442\u0443\u043f\u0430\u0442\u044c \u0443\u0436\u0435 \u043d\u0435 Web-\u0431\u0440\u0430\u0443\u0437\u0435\u0440, \u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u0439 \u043a\u043e\u0434, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u0443\u0434\u0435\u0442 \u0434\u043e\u0437\u0430\u043f\u0440\u0430\u0448\u0438\u0432\u0430\u0442\u044c \u0440\u0435\u0441\u0443\u0440\u0441\u044b, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0435 \u0434\u043b\u044f \u043f\u043e\u043b\u043d\u043e\u0439 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0442\u044c \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043a Backend \u0438 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u043c \u0441\u0435\u0440\u0432\u0438\u0441\u0430\u043c.<\/p>\n<h4>\u0421\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u043e\u0439 \u0447\u0430\u0441\u0442\u0438<\/h4>\n<p><strong>Frontend<\/strong>\u00a0(&#171;Front-end&#187;) \u2014 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0430\u044f \u0441\u0442\u043e\u0440\u043e\u043d\u0430 web-\u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 \u0434\u043b\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 \u0441\u0435\u0440\u0432\u0438\u0441\u043e\u043c (Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c).<\/p>\n<p>\u0421\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u0438 \u0432\u0441\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0430 \u043d\u0435\u0439 \u0432 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u043c \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435 \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u044e\u0442\u0441\u044f \u043a\u0430\u043a DOM-\u0434\u0435\u0440\u0435\u0432\u043e \u0438 \u0438\u043c\u0435\u044e\u0442 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u0443\u044e \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0443.<\/p>\n<p><strong>DOM<\/strong>\u00a0(&#171;Document Object Model&#187;) \u2014 \u044d\u0442\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u0430\u044f \u043c\u043e\u0434\u0435\u043b\u044c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f HTML-\u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430 \u0432 \u0432\u0438\u0434\u0435 \u0434\u0435\u0440\u0435\u0432\u0430 \u0442\u044d\u0433\u043e\u0432, \u0432\u044b\u0441\u0442\u0443\u043f\u0430\u044e\u0449\u0430\u044f \u043a\u0430\u043a \u043d\u0435\u043a\u0438\u0439 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u043d\u044b\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0439 \u0434\u043b\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 HTML-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u0447\u0435\u0440\u0435\u0437 JavaScript.<\/p>\n<p>\u0421\u0445\u0435\u043c\u0430\u0442\u0438\u0447\u043d\u043e\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 DOM:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/090\/1f7\/8ef\/0901f78eff15301792989c0496fde346.png\" width=\"799\" height=\"268\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/090\/1f7\/8ef\/0901f78eff15301792989c0496fde346.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0421\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 DOM:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/913\/742\/4fa\/9137424fadd202ec42f7d548816f2ef3.png\" width=\"1000\" height=\"888\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/913\/742\/4fa\/9137424fadd202ec42f7d548816f2ef3.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>HTML<\/strong>\u00a0(&#171;HyperText Markup Language&#187;) \u2014 \u044f\u0437\u044b\u043a \u0440\u0430\u0437\u043c\u0435\u0442\u043a\u0438 \u0434\u043b\u044f Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446 (\u0432 \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0435\u0435 \u0432\u0440\u0435\u043c\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f HTML5 \u0432\u0435\u0440\u0441\u0438\u044f \u044f\u0437\u044b\u043a\u0430).<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a:\u00a0<a href=\"https:\/\/www.w3.org\/\">World Wide Web Consortium<\/a>\u00a0(W3C),\u00a0<a href=\"https:\/\/whatwg.org\/\">WHATWG<\/a>\u00a0(\u0420\u0430\u0437\u0432\u0438\u0442\u0438\u0435 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0439 \u0438 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u0432)<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0421\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/html.spec.whatwg.org\/\">HTML Living Standard<\/a>,\u00a0<a href=\"https:\/\/www.w3.org\/TR\/2011\/WD-html5-20110405\">HTML5<\/a><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>\u0421\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441 HTML \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 HTML-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e\u0442 \u0442\u044d\u0433\u0438 \u0438 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u043e\u0432 \u044d\u0442\u0438\u0445 \u0442\u044d\u0433\u043e\u0432.<\/p>\n<p>\u0422\u044d\u0433 (&#171;HTML Tag&#187;) \u2014 \u0447\u0430\u0441\u0442\u044c \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u0431\u043b\u043e\u043a\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0440\u0430\u0437\u043c\u0435\u0447\u0430\u0435\u0442 \u043e\u0431\u043b\u0430\u0441\u0442\u044c, \u0433\u0434\u0435 \u0431\u0443\u0434\u0435\u0442 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 HTML-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0438 \u0437\u0430\u0434\u0430\u044e\u0442 \u0435\u0433\u043e \u0442\u0438\u043f.<\/p>\n<p>HTML-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0441\u043e\u0441\u0442\u043e\u044f\u0442 \u0438\u0437:<\/p>\n<ul>\n<li>\n<p>\u0422\u044d\u0433 \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u044f \u2014 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442, \u0433\u0434\u0435 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442\u0441\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;&lt;title>&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0422\u044d\u0433 \u0437\u0430\u043a\u0440\u044b\u0442\u0438\u044f \u2014 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442, \u0433\u0434\u0435 \u0437\u0430\u043a\u0430\u043d\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;&lt;\/title>&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0410\u0442\u0440\u0438\u0431\u0443\u0442 \u0438 \u0435\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u2014 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u0442\u044d\u0433\u0430 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;href=&#187;<a href=\"https:\/\/www.google.com\/\">http:\/\/www.google.com<\/a>&#171;&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0421\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u2014 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u043e\u0435 \u043d\u0430\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435, \u043d\u0430\u0445\u043e\u0434\u044f\u0449\u0435\u0435\u0441\u044f \u043c\u0435\u0436\u0434\u0443 \u0442\u044d\u0433\u043e\u043c \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u044f \u0438 \u0442\u044d\u0433\u043e\u043c \u0437\u0430\u043a\u0440\u044b\u0442\u0438\u044f<\/p>\n<\/li>\n<li>\n<p>\u041a\u043e\u043c\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u0439 \u2014 \u043d\u0435\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e) (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;&lt;!&#8212; Comment &#8212;>&#187;)<\/p>\n<\/li>\n<\/ul>\n<p>\u041d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043f\u0440\u0438\u043c\u0435\u0440\u043e\u0432 HTML \u0442\u044d\u0433\u043e\u0432:<\/p>\n<p>&lt;html> \u2014 (\u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0442\u044d\u0433) \u0441\u043e\u043e\u0431\u0449\u0430\u0435\u0442 \u043e \u0442\u043e\u043c, \u0447\u0442\u043e \u044d\u0442\u043e HTML-\u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442 (\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043a\u043e\u0440\u043d\u0435\u0432\u044b\u043c \u0442\u044d\u0433\u043e\u043c)<br \/>&lt;head> \u2014 (\u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0442\u044d\u0433) \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0442\u0435\u0445\u043d\u0438\u0447\u0435\u0441\u043a\u0443\u044e \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e<br \/>&lt;title> \u2014 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<br \/>&lt;style> \u2014 \u0437\u0430\u0434\u0430\u0451\u0442 CSS \u0441\u0442\u0438\u043b\u0438 \u0434\u043b\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<br \/>&lt;script> \u2014 \u0445\u0440\u0430\u043d\u0438\u0442 JavaScript \u043a\u043e\u0434 \u0438\/\u0438\u043b\u0438 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0434\u043b\u044f \u043d\u0435\u0433\u043e (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0443\u0442\u044c \u0434\u043e \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u0433\u043e JS-\u0444\u0430\u0439\u043b\u0430)<br \/>&lt;body> \u2014 (\u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0442\u044d\u0433) \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u0432\u0438\u0434\u0438\u043c\u0443\u044e \u0447\u0430\u0441\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/p>\n<details class=\"spoiler\">\n<summary>\u041f\u0440\u0438\u043c\u0435\u0440 HTML-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043f\u0443\u0441\u0442\u043e\u0439 \u0432\u043a\u043b\u0430\u0434\u043a\u0438 \u0438\u0437 Google Chrome:<\/summary>\n<div class=\"spoiler__content\">\n<pre><code>&lt;!doctype html>&lt;html dir=\"ltr\" lang=\"ru\">  &lt;head>    &lt;meta charset=\"utf-8\">    &lt;title>\u041d\u043e\u0432\u0430\u044f \u0432\u043a\u043b\u0430\u0434\u043a\u0430&lt;\/title>    &lt;style>      body {        background: #35363A;        margin: 0;      }      #backgroundImage {        border: none;        height: 100%;        pointer-events: none;        position: fixed;        top: 0;        visibility: hidden;        width: 100%;      }      [show-background-image] #backgroundImage {        visibility: visible;      }    &lt;\/style>  &lt;\/head>  &lt;body>    &lt;iframe id=\"backgroundImage\" src=\"\">&lt;\/iframe>    &lt;ntp-app>&lt;\/ntp-app>    &lt;script type=\"module\" src=\"new_tab_page.js\">&lt;\/script>    &lt;link rel=\"stylesheet\" href=\"chrome:\/\/resources\/css\/text_defaults_md.css\">    &lt;link rel=\"stylesheet\" href=\"shared_vars.css\">  &lt;\/body>&lt;\/html><\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n<p><strong>CSS<\/strong>\u00a0(&#171;Cascading Style Sheets&#187;) \u2014 \u044f\u0437\u044b\u043a \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u0432\u043d\u0435\u0448\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0430 HTML-\u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430.<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a:\u00a0<a href=\"https:\/\/www.w3.org\/\">World Wide Web Consortium<\/a>\u00a0(W3C)<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0421\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/www.w3.org\/Style\/CSS\/specs.en.html\">CSS Specification<\/a><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>\u041a\u0430\u043a \u0431\u044b\u043b\u043e \u0441\u043a\u0430\u0437\u0430\u043d\u043e \u0440\u0430\u043d\u0435\u0435, \u0432 \u0442\u044d\u0433\u0435 &lt;style> \u0437\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u044b CSS \u0441\u0442\u0438\u043b\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, \u0433\u0434\u0435 \u043c\u043e\u0436\u0435\u0442 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u043a\u0430\u0441\u043a\u0430\u0434\u043d\u043e\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0432\u043d\u0435\u0448\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0430 \u0438\u043b\u0438 \u0441\u0441\u044b\u043b\u043a\u0438 \u043d\u0430 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0439 CSS-\u0444\u0430\u0439\u043b.<\/p>\n<p>\u0421\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441 CSS \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 CSS \u043f\u0440\u0430\u0432\u0438\u043b\u0430, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u043a\u0430\u043a \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u0431\u043b\u043e\u043a \u043a\u043e\u0434\u0430 \u0438 \u0432\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u0432 \u0441\u0435\u0431\u044f:<\/p>\n<ul>\n<li>\n<p>\u0421\u0435\u043b\u0435\u043a\u0442\u043e\u0440 \u2014 \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;header&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0421\u0432\u043e\u0439\u0441\u0442\u0432\u043e \u2014 \u0434\u043b\u044f \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u043e\u0433\u043e \u0432 \u0441\u0435\u043b\u0435\u043a\u0442\u043e\u0440\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;font-style&#187;)<\/p>\n<\/li>\n<li>\n<p>\u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u2014 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u044d\u0442\u043e\u0433\u043e \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;bold&#187;)<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041f\u0440\u0438\u043c\u0435\u0440 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u043e\u0434\u043d\u043e\u0433\u043e \u0438\u0437 CSS-\u0444\u0430\u0439\u043b\u043e\u0432 \u0434\u043b\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b YouTube:<\/summary>\n<div class=\"spoiler__content\">\n<pre><code>.picker-frame {    width: 100%;    height: 100%;    border: 0;    overflow: hidden}.picker.modal-dialog-bg {    position: absolute;    top: 0;    left: 0;    background-color: #fff}.picker.modal-dialog {    position: absolute;    top: 0;    left: 0;    background-color: #fff;    border: 1px solid #acacac;    width: auto;    padding: 0;    z-index: 1001;    overflow: auto;    -moz-box-shadow: rgba(0,0,0,.2) 0 4px 16px;    -webkit-box-shadow: rgba(0,0,0,.2) 0 4px 16px;    box-shadow: rgba(0,0,0,.2) 0 4px 16px;    -webkit-transition: top .5s ease-in-out;    -moz-transition: top .5s ease-in-out;    -o-transition: top .5s ease-in-out;    transition: top .5s ease-in-out}.picker-min {    position: absolute;    z-index: 1002}.picker.modal-dialog-content {    font-size: 0;    padding: 0}.picker.modal-dialog-title {    height: 0;    margin: 0}.picker.modal-dialog-title-text,.picker.modal-dialog-buttons {    display: none}.picker.modal-dialog-bg,.picker.modal-dialog.picker-dialog {    z-index: 1999999999}<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n<p><strong>JS<\/strong>\u00a0(&#171;JavaScript&#187;) \u2014 \u044d\u0442\u043e \u0432\u044b\u0441\u043e\u043a\u043e\u0443\u0440\u043e\u0432\u043d\u0435\u0432\u044b\u0439\u00a0\u043c\u0443\u043b\u044c\u0442\u0438\u043f\u0430\u0440\u0430\u0434\u0438\u0433\u043c\u0435\u043d\u043d\u044b\u0439\u00a0\u044f\u0437\u044b\u043a \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f.<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a:\u00a0<a href=\"https:\/\/brendaneich.com\/\">Brendan Eich<\/a><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0421\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/www.ecma-international.org\/publications-and-standards\/standards\/ecma-262\">ECMA-262<\/a><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>\u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 JavaScript \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u043e\u0431\u0448\u0438\u0440\u043d\u044b, \u0438 \u0438\u0437\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e \u043e\u043d \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0441\u044f \u0434\u043b\u044f \u00ab\u043e\u0436\u0438\u0432\u043b\u0435\u043d\u0438\u044f\u00bb HTML-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, \u043d\u043e \u0441\u0435\u0439\u0447\u0430\u0441 JavaScript \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043f\u043e\u043b\u043d\u043e\u0446\u0435\u043d\u043d\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0449\u0443\u044e \u043b\u043e\u0433\u0438\u043a\u0443, \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u044b\u0432\u0430\u0442\u044c \u043a\u043b\u0438\u0435\u043d\u0442-\u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u0435 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435, \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u043c\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435, \u043d\u0435 \u0441\u0447\u0438\u0442\u0430\u044f \u0442\u0430\u043a\u0438\u0445 \u0432\u0435\u0449\u0435\u0439, \u043a\u0430\u043a \u0445\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0445 \u0438 \u0438\u0441\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u0441\u043a\u0440\u0438\u043f\u0442\u043e\u0432 \u043f\u043e \u0441\u043e\u0431\u044b\u0442\u0438\u044f\u043c \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 (\u0438 \u044d\u0442\u043e \u0434\u0430\u043b\u0435\u043a\u043e \u043d\u0435 \u043f\u043e\u043b\u043d\u044b\u0439 \u043f\u0435\u0440\u0435\u0447\u0435\u043d\u044c).<\/p>\n<p>JS \u0441\u043a\u0440\u0438\u043f\u0442\u044b \u0432\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u0432 HTML \u0438 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u044e\u0442\u0441\u044f \u043f\u0440\u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b.<\/p>\n<p>\u041f\u0430\u0440\u0430-\u0442\u0440\u043e\u0439\u043a\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u043e\u0432 HTML \u0441\u043e\u0431\u044b\u0442\u0438\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0436\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c JS:<\/p>\n<ul>\n<li>\n<p>onchange \u2014 \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u043e\u0431 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 HTML \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430<\/p>\n<\/li>\n<li>\n<p>onclick \u2014 \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u043e \u043a\u043b\u0438\u043a\u0435 \u043c\u044b\u0448\u0438 \u043d\u0430 HTML \u044d\u043b\u0435\u043c\u0435\u043d\u0442<\/p>\n<\/li>\n<li>\n<p>onkeydown \u2014 \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u043e \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043a\u043b\u0430\u0432\u0438\u0448\u0438 \u043d\u0430 \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u0435<\/p>\n<\/li>\n<li>\n<p>onload \u2014 \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u043e\u0431 \u043e\u043a\u043e\u043d\u0447\u0430\u043d\u0438\u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 HTML-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041f\u0440\u0438\u043c\u0435\u0440 \u043a\u043e\u0434\u0430 JS-\u0441\u043a\u0440\u0438\u043f\u0442\u0430 \u0438\u0437 \u043f\u0443\u0441\u0442\u043e\u0439 \u0432\u043a\u043b\u0430\u0434\u043a\u0438 Google Chrome, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u044b\u0432\u043e\u0434\u0438\u0442 assert-\u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f:<\/summary>\n<div class=\"spoiler__content\">\n<pre><code>\/\/ Copyright (c) 2013 The Chromium Authors. All rights reserved.\/\/ Use of this source code is governed by a BSD-style license that can be\/\/ found in the LICENSE file.\/** * @fileoverview Assertion support. *\/\/** * Verify |condition| is truthy and return |condition| if so. * @template T * @param {T} condition A condition to check for truthiness.  Note that this *     may be used to test whether a value is defined or not, and we don't want *     to force a cast to Boolean. * @param {string=} opt_message A message to show on failure. * @return {T} A non-null |condition|. * @closurePrimitive {asserts.truthy} * @suppress {reportUnknownTypes} because T is not sufficiently constrained. *\/export function assert(condition, opt_message) {  if (!condition) {    let message = 'Assertion failed';    if (opt_message) {      message = message + ': ' + opt_message;    }    const error = new Error(message);    const global = function() {      const thisOrSelf = this || self;      \/** @type {boolean} *\/      thisOrSelf.traceAssertionsForTesting;      return thisOrSelf;    }();    if (global.traceAssertionsForTesting) {      console.warn(error.stack);    }    throw error;  }  return condition;}\/** * Call this from places in the code that should never be reached. * * For example, handling all the values of enum with a switch() like this: * *   function getValueFromEnum(enum) { *     switch (enum) { *       case ENUM_FIRST_OF_TWO: *         return first *       case ENUM_LAST_OF_TWO: *         return last; *     } *     assertNotReached(); *     return document; *   } * * This code should only be hit in the case of serious programmer error or * unexpected input. * * @param {string=} opt_message A message to show when this is hit. * @closurePrimitive {asserts.fail} *\/export function assertNotReached(opt_message) {  assert(false, opt_message || 'Unreachable code hit');}\/** * @param {*} value The value to check. * @param {function(new: T, ...)} type A user-defined constructor. * @param {string=} opt_message A message to show when this is hit. * @return {T} * @template T *\/export function assertInstanceof(value, type, opt_message) {  \/\/ We don't use assert immediately here so that we avoid constructing an error  \/\/ message if we don't have to.  if (!(value instanceof type)) {    assertNotReached(        opt_message ||        'Value ' + value + ' is not a[n] ' + (type.name || typeof type));  }  return value;}<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n<p><strong>\u041d\u0435 \u0445\u043e\u0442\u0435\u043b\u043e\u0441\u044c \u0431\u044b \u0443\u043f\u0443\u0441\u043a\u0430\u0442\u044c \u0438\u0437 \u0432\u0438\u0434\u0443 \u0442\u0430\u043a\u043e\u0439 \u0442\u0435\u0440\u043c\u0438\u043d \u043a\u0430\u043a \u00ab\u043a\u043e\u043d\u0442\u0435\u043d\u0442\u00bb.<\/strong><\/p>\n<p>\u0412\u0441\u0451 \u0432\u044b\u0448\u0435\u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d\u043d\u043e\u0435 \u0432 \u044d\u0442\u043e\u043c \u0431\u043b\u043e\u043a\u0435 \u0442\u0430\u043a \u0438\u043b\u0438 \u0438\u043d\u0430\u0447\u0435 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u043a \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0443 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b.<\/p>\n<p><strong>\u041a\u043e\u043d\u0442\u0435\u043d\u0442<\/strong>\u00a0\u2014 \u044d\u0442\u043e \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u043e\u0435 \u043d\u0430\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b.<\/p>\n<p>\u0412 Web&#8217;\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0442 \u0442\u0430\u043a\u0438\u0435 \u043f\u043e\u043d\u044f\u0442\u0438\u044f \u043a\u0430\u043a \u00ab\u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439\u00bb \u0438 \u00ab\u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0439\u00bb \u2014 \u043f\u043e \u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u044e \u043a \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0443 \u0438\u043b\u0438 \u043a \u0441\u0430\u0439\u0442\u0443 \u0446\u0435\u043b\u0438\u043a\u043e\u043c.<\/p>\n<p><strong>\u0421\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0441\u0430\u0439\u0442<\/strong>\u00a0\u2014 \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u043d\u0435\u0438\u0437\u043c\u0435\u043d\u044f\u0435\u043c\u044b\u0445 \u0441\u0442\u0440\u0430\u043d\u0438\u0446, \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0445\u0440\u0430\u043d\u0438\u0442\u0441\u044f \u043d\u0430 Web-\u0441\u0435\u0440\u0432\u0435\u0440\u0435 \u0432 \u043d\u0435\u0438\u0437\u043c\u0435\u043d\u044f\u0435\u043c\u043e\u043c \u0432\u0438\u0434\u0435 (HTML, CSS, JS, \u041c\u0443\u043b\u044c\u0442\u0438\u043c\u0435\u0434\u0438\u0430, \u043f\u0440\u043e\u0447\u0438\u0435 \u0431\u0438\u043d\u0430\u0440\u043d\u044b\u0435 \u0444\u0430\u0439\u043b\u044b).<\/p>\n<p><strong>\u0414\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0441\u0430\u0439\u0442<\/strong>\u00a0\u2014 \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u0438\u0437\u043c\u0435\u043d\u044f\u044e\u0449\u0438\u0445\u0441\u044f, \u0430\u0434\u0430\u043f\u0442\u0438\u0440\u0443\u044e\u0449\u0438\u0445\u0441\u044f \u043f\u043e\u0434 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0433\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446 (\u0438\u043b\u0438 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432), \u0438 \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043d\u0430 Web-\u0441\u0435\u0440\u0432\u0435\u0440\u0435 \u0432 \u043c\u043e\u043c\u0435\u043d\u0442 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u0437\u0430\u043f\u0440\u043e\u0441\u0430 (\u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043d\u0430 Backend, \u0444\u043e\u0440\u043c\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0438\u0437 \u0431\u0430\u0437 \u0434\u0430\u043d\u043d\u044b\u0445).<\/p>\n<\/p>\n<h4>\u041f\u0440\u043e\u0447\u0438\u0435 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u044b \u0432\u043e Frontend \u0447\u0430\u0441\u0442\u0438<\/h4>\n<p><strong>WebGL<\/strong>\u00a0(&#171;Web-based Graphics Library&#187;) \u2014 \u043a\u0440\u043e\u0441\u043f\u043b\u0430\u0442\u0444\u043e\u0440\u043c\u0435\u043d\u043d\u044b\u0439 API \u0434\u043b\u044f 3D-\u0433\u0440\u0430\u0444\u0438\u043a\u0438 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435. \u0420\u0430\u0437\u043c\u0435\u0449\u0430\u0435\u0442\u0441\u044f \u0432 HTML-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0435 \u043f\u043e\u0434 \u0442\u044d\u0433\u043e\u043c &lt;canvas>.<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a:\u00a0<a href=\"https:\/\/www.khronos.org\/\">KHRONOS Group<\/a><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0421\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/www.khronos.org\/registry\/webgl\/specs\/latest\/1.0\">WebGL Specification<\/a><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p><strong>WebRTC<\/strong>\u00a0(&#171;Web Real Time Communications&#187;) \u2014 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0443 \u043f\u043e\u0442\u043e\u043a\u043e\u0432\u044b\u0445 \u0430\u0443\u0434\u0438\u043e\/\u0432\u0438\u0434\u0435\u043e \u0434\u0430\u043d\u043d\u044b\u0445.<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a: Justin Uberti\u00a0Peter Thatcher<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0421\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/www.w3.org\/TR\/webrtc\">WebRTC: Real-Time Communication Between Browsers<\/a><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>Connection \u2014 \u0441\u043f\u043e\u0441\u043e\u0431\u044b \u0441\u0432\u044f\u0437\u0438 \u043c\u0435\u0436\u0434\u0443 \u043a\u043b\u0438\u0435\u043d\u0442\u043e\u043c \u0438 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c (REST, SOAP, WS)<\/summary>\n<div class=\"spoiler__content\">\n<p>\u041a\u043b\u0438\u0435\u043d\u0442-\u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u0435 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435, \u0432 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0431\u044b\u043b\u043e \u0431\u044b \u043d\u0435\u0432\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u043c \u0431\u0435\u0437 \u043e\u0431\u0449\u0435\u043d\u0438\u044f Frontend \u0447\u0430\u0441\u0442\u0438 \u0441 Backend \u0447\u0430\u0441\u0442\u044c\u044e.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0440\u044f\u0434 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0439, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0449\u0438\u0445 \u044d\u0442\u043e \u043e\u0431\u0449\u0435\u043d\u0438\u0435 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u0430\u0442\u044c. \u041e\u0442 \u0443\u0436\u0435 \u0443\u043f\u043e\u043c\u044f\u043d\u0443\u0442\u043e\u0433\u043e HTTP \u0434\u043e \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f \u0447\u0435\u0440\u0435\u0437 WS.<\/p>\n<p><strong>WS<\/strong>\u00a0(&#171;Web-Socket&#187;) \u2014 \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b \u0441\u0432\u044f\u0437\u0438 \u043f\u0440\u0435\u0434\u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u043d\u044b\u0439 \u0434\u043b\u044f \u043e\u0431\u043c\u0435\u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0430 \u0438 \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u0432 \u0440\u0435\u0436\u0438\u043c\u0435 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438.<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a:\u00a0<a href=\"https:\/\/www.ietf.org\/\">Internet Engineering Task Force<\/a>\u00a0(IETF)<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0421\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/datatracker.ietf.org\/doc\/html\/rfc6455\">The WebSocket Protocol<\/a><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>\u0412 HTTP, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u043e\u0442\u0432\u0435\u0442 \u043e\u0442 \u0441\u0435\u0440\u0432\u0435\u0440\u0430, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0441\u043f\u0435\u0440\u0432\u0430 \u043f\u043e\u0441\u043b\u0430\u0442\u044c \u0437\u0430\u043f\u0440\u043e\u0441, \u0430 \u0434\u043b\u044f WS \u0441\u043f\u0435\u0440\u0432\u0430 \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0441\u043e\u043a\u0435\u0442\u043d\u043e\u0435 \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u0435 \u0441 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c, \u0433\u0434\u0435 \u0431\u0443\u0434\u0435\u0442 \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u00ab\u043f\u0440\u043e\u0441\u043b\u0443\u0448\u043a\u0430\u00bb \u0434\u0430\u043d\u043d\u044b\u0445 \u0432 real-time, \u043f\u043e\u043a\u0430 \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u0435 \u00ab\u0436\u0438\u0432\u0451\u0442\u00bb:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/ba5\/ad1\/1ef\/ba5ad11ef688b4e89eaa9044140990a9.png\" width=\"800\" height=\"480\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ba5\/ad1\/1ef\/ba5ad11ef688b4e89eaa9044140990a9.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>REST API<\/strong>\u00a0(RESTful) (&#171;REpresentational State Transfer&#187; &#171;Application Programm Interface&#187;) \u2014 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u043d\u0430\u044f \u043c\u043e\u0434\u0435\u043b\u044c \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u044f \u043a\u043b\u0438\u0435\u043d\u0442-\u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u0433\u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043f\u043e \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0430\u043c HTTP-\u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u0430.<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a:\u00a0<a href=\"https:\/\/roy.gbiv.com\/\">Roy Thomas Fielding<\/a>,\u00a0<a href=\"https:\/\/www.w3.org\/\">World Wide Web Consortium<\/a>\u00a0(W3C)<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0421\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/www.w3.org\/Protocols\/rfc2616\/rfc2616.html\">Hypertext Transfer Protocol<\/a>,\u00a0<a href=\"https:\/\/github.com\/OAI\/OpenAPI-Specification\/blob\/main\/versions\/3.0.3.md\">OpenAPI Specification<\/a><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>HTTP \u043c\u0435\u0442\u043e\u0434\u044b REST API (CRUD \u2014 Create, Read, Update, Delete):<\/p>\n<ul>\n<li>\n<p>GET \u2014 \u0447\u0442\u0435\u043d\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0445<\/p>\n<\/li>\n<li>\n<p>POST \u2014 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u043d\u043e\u0432\u044b\u0445 \u0434\u0430\u043d\u043d\u044b\u0445<\/p>\n<\/li>\n<li>\n<p>PUT \u2014 \u0440\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0445<\/p>\n<\/li>\n<li>\n<p>DELETE \u2014 \u0443\u0434\u0430\u043b\u0435\u043d\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0445<\/p>\n<\/li>\n<\/ul>\n<p>\u0417\u0430\u043f\u0440\u043e\u0441\u044b \u0438 \u043e\u0442\u0432\u0435\u0442\u044b \u043f\u043e \u043c\u043e\u0434\u0435\u043b\u0438 REST \u043e\u0431\u044b\u0447\u043d\u043e \u043f\u0440\u0438\u0445\u043e\u0434\u044f\u0442 \u0432 \u0444\u043e\u0440\u043c\u0430\u0442\u0435 JSON (&#171;JavaScript Object Notation&#187;).<\/p>\n<details class=\"spoiler\">\n<summary>\u041f\u0440\u0438\u043c\u0435\u0440 JSON&#8217;\u0430:<\/summary>\n<div class=\"spoiler__content\">\n<pre><code>{  \"squadName\": \"Super hero squad\",  \"homeTown\": \"Metro City\",  \"formed\": 2016,  \"secretBase\": \"Super tower\",  \"active\": true,  \"members\": [    {      \"name\": \"Molecule Man\",      \"age\": 29,      \"secretIdentity\": \"Dan Jukes\",      \"powers\": [        \"Radiation resistance\",        \"Turning tiny\",        \"Radiation blast\"      ]    },    {      \"name\": \"Madame Uppercut\",      \"age\": 39,      \"secretIdentity\": \"Jane Wilson\",      \"powers\": [        \"Million tonne punch\",        \"Damage resistance\",        \"Superhuman reflexes\"      ]    },    {      \"name\": \"Eternal Flame\",      \"age\": 1000000,      \"secretIdentity\": \"Unknown\",      \"powers\": [        \"Immortality\",        \"Heat Immunity\",        \"Inferno\",        \"Teleportation\",        \"Interdimensional travel\"      ]    }  ]}<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n<p>\u0414\u043b\u044f \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f \u043c\u043e\u0434\u0435\u043b\u0438 \u2014 \u0432 REST API \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0442 \u0442\u0430\u043a\u0438\u0435 \u043f\u043e\u043d\u044f\u0442\u0438\u044f, \u043a\u0430\u043a:<\/p>\n<ul>\n<li>\n<p>Route (&#171;\u041c\u0430\u0440\u0448\u0440\u0443\u0442&#187;) \u2014 \u044d\u0442\u043e \u0447\u0430\u0441\u0442\u044c URL-\u0430\u0434\u0440\u0435\u0441\u0430, \u0433\u0434\u0435 \u0443\u043a\u0430\u0437\u0430\u043d \u043f\u043e\u043b\u043d\u044b\u0439 \u043f\u0443\u0442\u044c \u0434\u043e \u0440\u0430\u0437\u0434\u0435\u043b\u0430 \u0438\u043b\u0438 \u0440\u0435\u0441\u0443\u0440\u0441\u0430. \u041c\u0430\u0440\u0448\u0440\u0443\u0442 \u043c\u043e\u0436\u0435\u0442 \u0438\u043c\u0435\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043a\u043e\u043d\u0435\u0447\u043d\u044b\u0445 \u0442\u043e\u0447\u0435\u043a.<\/p>\n<\/li>\n<li>\n<p>Endpoint (&#171;\u041a\u043e\u043d\u0435\u0447\u043d\u0430\u044f \u0442\u043e\u0447\u043a\u0430&#187;) \u2014 \u044d\u0442\u043e \u043e\u0431\u0440\u0430\u0449\u0435\u043d\u0438\u0435 \u043a \u043c\u0430\u0440\u0448\u0440\u0443\u0442\u0443 \u0447\u0435\u0440\u0435\u0437 \u0432\u044b\u0437\u043e\u0432 HTTP \u043c\u0435\u0442\u043e\u0434\u0430.<\/p>\n<\/li>\n<\/ul>\n<p>\u041d\u0430 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0435 \u043f\u0440\u0438\u0432\u0435\u0434\u0451\u043d \u0441\u043f\u043e\u0441\u043e\u0431 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0447\u0435\u0440\u0435\u0437 RESTful \u043c\u043e\u0434\u0435\u043b\u044c:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/4d2\/0bb\/cb1\/4d20bbcb1b2444171daf5d78c4b7b691.png\" width=\"2140\" height=\"946\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/4d2\/0bb\/cb1\/4d20bbcb1b2444171daf5d78c4b7b691.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>SOAP<\/strong>\u00a0(&#171;Simple Object Access Protocol&#187;) \u2014 \u0443\u043f\u0440\u043e\u0449\u0451\u043d\u043d\u044b\u0439 \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b \u043e\u0431\u043c\u0435\u043d\u0430 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u043c\u0438 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f\u043c\u0438.<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a:\u00a0<a href=\"http:\/\/davewiner.com\/\">Dave Winer<\/a>, Don Box, Bob Atkinson, Mohsen Al-Ghosein<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0421\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/www.w3.org\/TR\/soap\">SOAP architecture and message format<\/a><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>SOAP \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u0433\u0440\u043e\u043c\u043e\u0437\u0434\u043a\u0438\u043c \u0438 \u0443\u0441\u0442\u0430\u0440\u0435\u0432\u0448\u0438\u043c \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u043e\u043c, \u0438 \u0432 \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0435\u0435 \u0432\u0440\u0435\u043c\u044f \u0432\u0441\u0451 \u0440\u0435\u0436\u0435 \u0433\u0434\u0435-\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f.<\/p>\n<p>\u0417\u0430\u043f\u0440\u043e\u0441\u044b \u0438 \u043e\u0442\u0432\u0435\u0442\u044b \u0432 SOAP \u043f\u0440\u0438\u0445\u043e\u0434\u044f\u0442 \u0432 \u0444\u043e\u0440\u043c\u0430\u0442\u0435 XML (&#171;eXtensible Markup Language&#187;).<\/p>\n<details class=\"spoiler\">\n<summary>\u041f\u0440\u0438\u043c\u0435\u0440\u044b SOAP \u0437\u0430\u043f\u0440\u043e\u0441\u0430-\u043e\u0442\u0432\u0435\u0442\u0430 \u0432 \u0444\u043e\u0440\u043c\u0430\u0442\u0435 XML:<\/summary>\n<div class=\"spoiler__content\">\n<p>Request<\/p>\n<pre><code>POST \/InStock HTTP\/1.1Host: www.example.orgContent-Type: application\/soap+xml; charset=utf-8Content-Length: nnn&lt;?xml version=\"1.0\"?>&lt;soap:Envelopexmlns:soap=\"http:\/\/www.w3.org\/2003\/05\/soap-envelope\/\"soap:encodingStyle=\"http:\/\/www.w3.org\/2003\/05\/soap-encoding\">&lt;soap:Body xmlns:m=\"http:\/\/www.example.org\/stock\">  &lt;m:GetStockPrice>    &lt;m:StockName>IBM&lt;\/m:StockName>  &lt;\/m:GetStockPrice>&lt;\/soap:Body>&lt;\/soap:Envelope><\/code><\/pre>\n<p>Response<\/p>\n<pre><code>HTTP\/1.1 200 OKContent-Type: application\/soap+xml; charset=utf-8Content-Length: nnn&lt;?xml version=\"1.0\"?>&lt;soap:Envelopexmlns:soap=\"http:\/\/www.w3.org\/2003\/05\/soap-envelope\/\"soap:encodingStyle=\"http:\/\/www.w3.org\/2003\/05\/soap-encoding\">&lt;soap:Body xmlns:m=\"http:\/\/www.example.org\/stock\">  &lt;m:GetStockPriceResponse>    &lt;m:Price>34.5&lt;\/m:Price>  &lt;\/m:GetStockPriceResponse>&lt;\/soap:Body>&lt;\/soap:Envelope><\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n<p>\u0420\u0430\u0431\u043e\u0442\u0430 SOAP \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u0430 (\u0438\u0437\u0432\u0438\u043d\u044f\u044e\u0441\u044c \u0437\u0430 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u043e, \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b \u0441\u0442\u0430\u0440\u0435\u043d\u044c\u043a\u0438\u0439, \u0438 \u043a\u0440\u0430\u0441\u0438\u0432\u044b\u0435 \u043a\u0430\u0440\u0442\u0438\u043d\u043e\u0447\u043a\u0438 \u043d\u0430\u0439\u0442\u0438 \u0441\u043b\u043e\u0436\u043d\u043e):<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/99d\/588\/b6d\/99d588b6dc726a2c935dc5d73a9150d5.png\" width=\"562\" height=\"280\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/99d\/588\/b6d\/99d588b6dc726a2c935dc5d73a9150d5.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0421\u0440\u0430\u0432\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u0441\u0445\u0435\u043c\u0430 \u0440\u0430\u0431\u043e\u0442\u044b SOAP \u0438 REST:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/b92\/967\/a51\/b92967a518a78758149da386b9a66c72.png\" width=\"640\" height=\"455\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/b92\/967\/a51\/b92967a518a78758149da386b9a66c72.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>gRPC<\/strong>\u00a0(&#171;Remote Proccedure Calls&#187;) \u2014 \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b \u0434\u043b\u044f \u0443\u0434\u0430\u043b\u0451\u043d\u043d\u043e\u0433\u043e \u0432\u044b\u0437\u043e\u0432\u0430 \u043f\u0440\u043e\u0446\u0435\u0434\u0443\u0440, \u043f\u0435\u0440\u0435\u0434\u0430\u0451\u0442 \u0434\u0430\u043d\u043d\u044b\u0435 \u0432 \u0431\u0438\u043d\u0430\u0440\u043d\u043e\u043c \u0432\u0438\u0434\u0435. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 HTTP\/2 (\u0432\u0442\u043e\u0440\u0430\u044f \u0432\u0435\u0440\u0441\u0438\u044f \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u0430 HTTP) \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0442\u0440\u0430\u043d\u0441\u043f\u043e\u0440\u0442\u0430.<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a:\u00a0<a href=\"https:\/\/about.google\/\">Google<\/a><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0421\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/developers.google.com\/protocol-buffers\/docs\/proto3\">Protocol Buffers<\/a>,\u00a0<a href=\"https:\/\/grpc.io\/docs\/what-is-grpc\/introduction\">Introduction to gRPC<\/a><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>\u0414\u0432\u0435 \u0441\u0445\u0435\u043c\u044b \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 gRPC \u0447\u0435\u0440\u0435\u0437 gRPC-Web \u0438 \u0447\u0435\u0440\u0435\u0437 REST:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/273\/143\/6dd\/2731436dd8a31bc5dbd0a5b2b93fa408.png\" width=\"1224\" height=\"303\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/273\/143\/6dd\/2731436dd8a31bc5dbd0a5b2b93fa408.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>GraphQL<\/strong>\u00a0(Query Language) \u2014 \u0442\u0438\u043f\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u044f\u0437\u044b\u043a \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432 \u0434\u043b\u044f API \u0438 \u0441\u0440\u0435\u0434\u0430 \u0434\u043b\u044f \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u0442\u0430\u043a\u0438\u0445 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432.<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a:\u00a0<a href=\"https:\/\/graphql.org\/\">GraphQL Foundation<\/a><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0421\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/spec.graphql.org\/June2018\">GraphQL Specification<\/a><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>\u041f\u0440\u0438\u043d\u0446\u0438\u043f\u0438\u0430\u043b\u044c\u043d\u0430\u044f \u0441\u0445\u0435\u043c\u0430 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430 \u0441\u0435\u0440\u0432\u0438\u0441\u043e\u0432 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c GraphQL:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/336\/38c\/456\/33638c456e57e6d39e9aa4ee34c80941.png\" width=\"600\" height=\"293\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/336\/38c\/456\/33638c456e57e6d39e9aa4ee34c80941.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041d\u0443 \u0438 \u043a\u0443\u0434\u0430 \u0436\u0435 \u0431\u0435\u0437 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0438 \u0441 \u043f\u0440\u0438\u043c\u0435\u0440\u043e\u043c \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u044f \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0439:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/029\/bd9\/3f8\/029bd93f837c489332c35d40b44ce5fd.png\" width=\"800\" height=\"480\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/029\/bd9\/3f8\/029bd93f837c489332c35d40b44ce5fd.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>Backend \u2014 \u0441\u0435\u0440\u0432\u0435\u0440\u043d\u044b\u0439 \u043a\u043e\u0434 (API, Services, Databases &#8230;)<\/summary>\n<div class=\"spoiler__content\">\n<p>\u0426\u0435\u043b\u044c\u044e \u0434\u0430\u043d\u043d\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0438 \u043d\u0435 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0440\u0430\u0441\u043a\u0440\u044b\u0442\u0438\u0435 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u0440\u0430\u0431\u043e\u0442\u044b \u0432\u0441\u0435\u0433\u043e \u0431\u044d\u043a\u0435\u043d\u0434\u0430 (\u0442.\u043a. \u0442\u0443\u0442 \u0432 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u043c \u0443\u043f\u043e\u0440 \u043d\u0430 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0443\u044e \u0447\u0430\u0441\u0442\u044c).\u00a0<br \/>\u041e\u0434\u043d\u0430\u043a\u043e \u0431\u044b\u043b\u043e \u0431\u044b \u043a\u043e\u0449\u0443\u043d\u0441\u0442\u0432\u043e\u043c \u043d\u0435 \u0443\u043f\u043e\u043c\u044f\u043d\u0443\u0442\u044c \u043e \u0442\u0435\u0445 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0430\u0445, \u0447\u0442\u043e \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u044f\u0442 \u0442\u0430\u043c, \u0445\u043e\u0442\u044f \u0431\u044b \u0432 \u043e\u0431\u0449\u0438\u0445 \u0447\u0435\u0440\u0442\u0430\u0445.<\/p>\n<p><strong>Backend<\/strong>\u00a0(&#171;Back-end&#187;) \u2014 \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u044f\u044f \u0447\u0430\u0441\u0442\u044c \u0441\u0435\u0440\u0432\u0438\u0441\u0430 (Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f), \u043e\u0442\u0432\u0435\u0447\u0430\u044e\u0449\u0430\u044f \u0437\u0430 \u0431\u0438\u0437\u043d\u0435\u0441-\u043b\u043e\u0433\u0438\u043a\u0443 \u0438 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u0434\u0430\u043d\u043d\u044b\u0445, \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u044e\u0449\u0430\u044f\u0441\u044f \u043d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 \u0441\u0435\u0440\u0432\u0435\u0440\u0430.<\/p>\n<p>\u0421\u0431\u043e\u0439 \u0432 \u0440\u0430\u0431\u043e\u0442\u0435 \u0431\u044d\u043a\u0435\u043d\u0434\u0430 \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0432\u043b\u0435\u0447\u044c \u0438 \u043e\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0443 \u0440\u0430\u0431\u043e\u0442\u044b \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<p>\u0423\u043f\u0440\u043e\u0449\u0451\u043d\u043d\u0430\u044f, \u043d\u043e \u043f\u0440\u0438 \u044d\u0442\u043e\u043c \u043f\u043e\u043d\u044f\u0442\u043d\u0430\u044f, \u0441\u0445\u0435\u043c\u0430 \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u043c\u0435\u0441\u0442\u043e \u0438 \u0440\u043e\u043b\u044c Backend \u0447\u0430\u0441\u0442\u0438 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/cd2\/f78\/e90\/cd2f78e9067da4d5b1b77247abe03918.png\" width=\"1308\" height=\"793\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/cd2\/f78\/e90\/cd2f78e9067da4d5b1b77247abe03918.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412\u044b\u0434\u0435\u043b\u044f\u044e\u0442 \u0434\u0432\u0430 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 \u0442\u0438\u043f\u0430 Backend \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u044b:<\/p>\n<ul>\n<li>\n<p><strong>\u041c\u043e\u043d\u043e\u043b\u0438\u0442\u043d\u0430\u044f<\/strong>\u00a0\u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0430 \u2014 \u0432\u0441\u0435 \u0441\u0435\u0440\u0432\u0438\u0441\u044b \u0431\u044d\u043a\u0435\u043d\u0434\u0430 \u00ab\u0437\u0430\u0448\u0438\u0442\u044b\u00bb \u0432 \u043e\u0434\u0438\u043d \u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u043c\u043e\u0434\u0443\u043b\u044c. \u0422\u0430\u043a\u0430\u044f \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0430 \u0440\u0430\u0437\u0432\u0451\u0440\u0442\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e.<\/p>\n<\/li>\n<li>\n<p><strong>\u041c\u0438\u043a\u0440\u043e\u0441\u0435\u0440\u0432\u0438\u0441\u043d\u0430\u044f<\/strong>\u00a0\u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0430 \u2014 \u0441\u0435\u0440\u0432\u0438\u0441\u044b \u0441\u043b\u0430\u0431\u043e \u0441\u0432\u044f\u0437\u0430\u043d\u043d\u044b \u0438 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0443\u044e\u0442 \u0434\u0440\u0443\u0433 \u0441 \u0434\u0440\u0443\u0433\u043e\u043c \u043d\u0430\u0445\u043e\u0434\u044f\u0441\u044c \u043d\u0430 \u0440\u0430\u0437\u043d\u044b\u0445 \u043c\u043e\u0434\u0443\u043b\u044f\u0445. \u0412 \u0442\u0430\u043a\u043e\u0439 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0435 \u043a\u0430\u0436\u0434\u044b\u0439 \u0441\u0435\u0440\u0432\u0438\u0441 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0440\u0430\u0437\u0432\u0451\u0440\u043d\u0443\u0442 \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438.<\/p>\n<\/li>\n<\/ul>\n<p><strong>Service<\/strong>\u00a0\u2014 \u043d\u0435\u043a\u043e\u0435 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u043d\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435 (\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0438\u043b\u0438 \u043c\u043e\u0434\u0443\u043b\u044c) \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0435\u0435 \u0443\u0441\u043b\u0443\u0433\u0443 \u0438\u043b\u0438 \u043d\u0430\u0431\u043e\u0440 \u0443\u0441\u043b\u0443\u0433.<\/p>\n<p>\u0410\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u043d\u043e\u0435 \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u0435:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/29b\/2ff\/a7a\/29b2ffa7ab9a971e65aa0ee44cf5d6ab.png\" width=\"840\" height=\"457\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/29b\/2ff\/a7a\/29b2ffa7ab9a971e65aa0ee44cf5d6ab.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0417\u0430 \u043e\u0431\u0449\u0435\u043d\u0438\u0435 \u043c\u0435\u0436\u0434\u0443 \u043a\u043b\u0438\u0435\u043d\u0442\u043e\u043c \u0438 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c \u043e\u0442\u0432\u0435\u0447\u0430\u0435\u0442 API.<\/p>\n<p><strong>API<\/strong>\u00a0(&#171;Application Programming Interface&#187;) \u2014 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u043d\u044b\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u043f\u0440\u0438\u043a\u043b\u0430\u0434\u043d\u043e\u0433\u043e \u0443\u0440\u043e\u0432\u043d\u044f, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0439 \u0438\u0437 \u0441\u0435\u0431\u044f \u043d\u0430\u0431\u043e\u0440 \u043c\u0435\u0442\u043e\u0434\u043e\u0432 \u0434\u043b\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 \u0441\u0435\u0440\u0432\u0438\u0441\u043e\u043c.<\/p>\n<p>API \u2014 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0448\u0438\u0440\u043e\u043a\u0438\u0439 \u0442\u0435\u0440\u043c\u0438\u043d \u0438 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u043f\u043e\u0432\u0441\u0435\u043c\u0435\u0441\u0442\u043d\u043e, \u0442\u0430\u043a \u043a\u0430\u043a API \u0435\u0441\u0442\u044c \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0443 \u043b\u044e\u0431\u043e\u0433\u043e \u0441\u0435\u0440\u0432\u0438\u0441\u0430, \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 \u0438\u043b\u0438 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u044b, \u043d\u0435 \u0433\u043e\u0432\u043e\u0440\u044f \u0443\u0436\u0435 \u043e\u0431 \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0445 \u0441\u0438\u0441\u0442\u0435\u043c\u0430\u0445 (Windows API). \u041d\u043e \u0437\u0434\u0435\u0441\u044c \u043d\u0430\u0441 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u0443\u0435\u0442 \u0442\u0430\u043a\u043e\u0439 \u0432\u0438\u0434 \u043a\u0430\u043a Web API, \u0445\u043e\u0442\u044f \u043e\u0431\u044b\u0447\u043d\u043e \u043f\u0440\u0438\u0441\u0442\u0430\u0432\u043a\u0443 &#171;Web&#187; \u043f\u0435\u0440\u0435\u0434 API \u043d\u0435 \u0443\u043f\u043e\u0442\u0440\u0435\u0431\u043b\u044f\u044e\u0442, \u0435\u0441\u043b\u0438 \u0438\u0437 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430 \u043f\u043e\u043d\u044f\u0442\u043d\u043e, \u043e \u043a\u0430\u043a\u043e\u043c API \u0438\u0434\u0451\u0442 \u0440\u0435\u0447\u044c.<\/p>\n<p>\u041a\u0440\u0430\u0441\u043d\u043e\u0439 \u043d\u0438\u0442\u044c\u044e \u0447\u0435\u0440\u0435\u0437 \u0432\u0441\u0451 \u043a\u043b\u0438\u0435\u043d\u0442-\u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u0435 \u043e\u0431\u0449\u0435\u043d\u0438\u0435 \u043f\u0440\u043e\u043b\u0435\u0433\u0430\u044e\u0442 \u0434\u0430\u043d\u043d\u044b\u0435 \u0438 CRUD-\u043e\u043f\u0435\u0440\u0430\u0446\u0438\u0438 \u043d\u0430\u0434 \u043d\u0438\u043c\u0438. \u0418 \u0435\u0441\u043b\u0438 Frontend \u043f\u043e\u0441\u044b\u043b\u0430\u0435\u0442 \u044d\u0442\u0438 \u0434\u0430\u043d\u043d\u044b\u0435, Backend \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u0442 \u044d\u0442\u0438 \u0434\u0430\u043d\u043d\u044b\u0435, \u0442\u043e \u0433\u0434\u0435 \u0436\u0435 \u043e\u043d\u0438 \u0445\u0440\u0430\u043d\u044f\u0442\u0441\u044f?<\/p>\n<p><strong>Database<\/strong>\u00a0(&#171;DB&#187;, &#171;\u0411\u0430\u0437\u0430 \u0434\u0430\u043d\u043d\u044b\u0445&#187;, &#171;\u0411\u0414&#187;) \u2014 \u044d\u0442\u043e \u0443\u043f\u043e\u0440\u044f\u0434\u043e\u0447\u0435\u043d\u043d\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u0438\u043b\u0438 \u0434\u0430\u043d\u043d\u044b\u0445, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0445\u0440\u0430\u043d\u044f\u0442\u0441\u044f \u0432 \u044d\u043b\u0435\u043a\u0442\u0440\u043e\u043d\u043d\u043e\u043c \u0432\u0438\u0434\u0435. \u0411\u0430\u0437\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u043d\u0435\u043e\u0442\u044a\u0435\u043c\u043b\u0435\u043c\u043e\u0439 \u0447\u0430\u0441\u0442\u044c\u044e Backend, \u0438 \u0434\u043b\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 \u0411\u0414 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u0441\u0435\u0440\u0432\u0435\u0440 \u0431\u0430\u0437 \u0434\u0430\u043d\u043d\u044b\u0445 (\u0421\u0423\u0411\u0414).<\/p>\n<p>\u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0442 \u0434\u0432\u0430 \u0442\u0438\u043f\u0430 \u0431\u0430\u0437 \u0434\u0430\u043d\u043d\u044b\u0445:<\/p>\n<ul>\n<li>\n<p><strong>SQL<\/strong>\u00a0(&#171;Structured Query Language&#187;) \u2014 \u0440\u0435\u043b\u044f\u0446\u0438\u043e\u043d\u043d\u0430\u044f \u0431\u0430\u0437\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \u0441 \u043f\u0440\u0435\u0434\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u044b\u043c\u0438 \u0441\u0445\u0435\u043c\u0430\u043c\u0438 (\u043e\u0441\u043d\u043e\u0432\u0430\u043d\u043d\u044b\u043c\u0438 \u043d\u0430 \u0442\u0430\u0431\u043b\u0438\u0446\u0430\u0445), \u0441\u043e \u0441\u0442\u0440\u043e\u0433\u043e \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u043c \u0434\u0430\u043d\u043d\u044b\u043c\u0438 \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0449\u0430\u044f SQL-\u044f\u0437\u044b\u043a \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432. \u0411\u0414 \u0441 \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u044b\u043c \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435\u043c.<\/p>\n<\/li>\n<li>\n<p><strong>NoSQL<\/strong>\u00a0(&#171;Not only SQL&#187;) \u2014 \u043d\u0435\u0440\u0435\u043b\u044f\u0446\u0438\u043e\u043d\u043d\u0430\u044f \u0431\u0430\u0437\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 \u0441 \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u043c\u0438 \u0441\u0445\u0435\u043c\u0430\u043c\u0438 \u0434\u043b\u044f \u043d\u0435\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0445 \u0434\u0430\u043d\u043d\u044b\u0445, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0445 \u0438\u0437 \u0441\u0435\u0431\u044f \u043d\u0430\u0431\u043e\u0440 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u043e\u0432, \u043a\u043b\u044e\u0447\u0435\u0439, \u0433\u0440\u0430\u0444\u043e\u0432, \u0441\u0442\u043e\u043b\u0431\u0446\u043e\u0432. \u0411\u0414 \u0441 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u043c \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435\u043c.<\/p>\n<\/li>\n<\/ul>\n<p>\u041d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0451\u043d\u043d\u044b\u0435 SQL \u0421\u0423\u0411\u0414: MySQL, MS SQL, PosgreSQL<\/p>\n<p>\u041d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0451\u043d\u043d\u044b\u0435 NoSQL \u0421\u0423\u0411\u0414: MongoDB, Cassandra, Redis<\/p>\n<p>\u0421\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u0435 \u0445\u0440\u0430\u043d\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445 \u0438 \u0441\u0441\u044b\u043b\u043e\u043a \u043d\u0430 \u043d\u0438\u0445 \u0432 SQL \u0438 NoSQL \u0431\u0430\u0437\u0430\u0445 \u0434\u0430\u043d\u043d\u044b\u0445:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/bb5\/a79\/9dd\/bb5a799dd0bfb6871913339d8e907e2a.png\" width=\"1024\" height=\"724\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/bb5\/a79\/9dd\/bb5a799dd0bfb6871913339d8e907e2a.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>Browser \u2014 \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e\u0435 \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0435 (Cache, Cookie, Session Storage, Local Storage)<\/summary>\n<div class=\"spoiler__content\">\n<p>\u042d\u0442\u043e \u0437\u0430\u043a\u043b\u044e\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u044d\u0442\u0430\u043f, \u043a\u043e\u0433\u0434\u0430 \u043a\u043b\u0438\u0435\u043d\u0442 \u0447\u0435\u0440\u0435\u0437 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0443\u0436\u0435 \u0432\u043e\u0432\u0441\u044e \u043e\u0431\u0449\u0430\u0435\u0442\u0441\u044f \u0441 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c, \u043f\u043e\u0441\u044b\u043b\u0430\u0435\u0442 \u0437\u0430\u043f\u0440\u043e\u0441\u044b, \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442 \u043e\u0442\u0432\u0435\u0442\u044b, \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0435\u0442 \u043a\u043e\u043d\u0442\u0435\u043d\u0442. \u0418 \u043d\u0435\u0443\u0436\u0435\u043b\u0438 \u043f\u043e\u0441\u043b\u0435 \u0437\u0430\u043a\u0440\u044b\u0442\u0438\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0435\u043c\u0443 \u043f\u043e\u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0441\u043d\u043e\u0432\u0430 \u0433\u043e\u043d\u044f\u0442\u044c \u0442\u0440\u0430\u0444\u0438\u043a \u0442\u0443\u0434\u0430-\u0441\u044e\u0434\u0430, \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u0438\u043b\u0438 \u0432\u043d\u043e\u0432\u044c \u0430\u0432\u0442\u043e\u0440\u0438\u0437\u043e\u0432\u044b\u0432\u0430\u0442\u044c\u0441\u044f? Nope!<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0443 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e\u0435 \u0445\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0445, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u0441\u0442\u0430\u044e\u0442\u0441\u044f \u0432 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0435 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c.<\/p>\n<p>\u041e\u0431 \u044d\u0442\u0438\u0445 \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u044b\u0445 \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0430\u0445 \u0443\u0436\u0435 \u0443\u043f\u043e\u043c\u0438\u043d\u0430\u043b\u043e\u0441\u044c \u0440\u0430\u043d\u0435\u0435: \u044d\u0442\u043e Cache, Cookie, Session Storage, Local Storage.<\/p>\n<p><strong>Cache<\/strong>\u00a0(&#171;\u041a\u044d\u0448&#187;) \u2014 \u044d\u0442\u043e \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u043a\u043e\u043f\u0438\u0439 \u0444\u0430\u0439\u043b\u043e\u0432, \u0432\u044b\u0441\u0442\u0443\u043f\u0430\u044e\u0449\u0435\u0435 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0431\u0443\u0444\u0435\u0440\u0430 \u0441 \u0431\u044b\u0441\u0442\u0440\u044b\u043c \u0434\u043e\u0441\u0442\u0443\u043f\u043e\u043c \u043a \u044d\u0442\u0438\u043c \u0437\u0430\u043a\u044d\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u043c \u0444\u0430\u0439\u043b\u0430\u043c.<\/p>\n<p>\u041f\u0440\u043e\u0446\u0435\u0441\u0441 \u043a\u044d\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432 \u043f\u0440\u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/f49\/dc5\/a29\/f49dc5a2936107fefa358a7f86b0a2ce.png\" width=\"695\" height=\"323\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/f49\/dc5\/a29\/f49dc5a2936107fefa358a7f86b0a2ce.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>Cookie<\/strong>\u00a0(&#171;\u041a\u0443\u043a\u0438&#187;) \u2014 \u044d\u0442\u043e \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u0435 \u0444\u0440\u0430\u0433\u043c\u0435\u043d\u0442\u044b \u0434\u0430\u043d\u043d\u044b\u0445, \u0445\u0440\u0430\u043d\u044f\u0449\u0438\u0435 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043e \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f\u0445 \u043d\u0430 \u0441\u0430\u0439\u0442\u0435 \u0438 \u043e \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0438 \u043a\u043b\u0438\u0435\u043d\u0442\u0430, \u043f\u0435\u0440\u0435\u0434\u0430\u044e\u0449\u0438\u0435\u0441\u044f \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440.<\/p>\n<p>\u0422\u0438\u043f\u044b Cookie \u043f\u043e \u043f\u0440\u0438\u043d\u0430\u0434\u043b\u0435\u0436\u043d\u043e\u0441\u0442\u0438:<\/p>\n<ul>\n<li>\n<p><strong>First-party<\/strong>\u00a0cookies \u2014 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0444\u0430\u0439\u043b cookie, \u043f\u0440\u0438\u043d\u0430\u0434\u043b\u0435\u0436\u0430\u0449\u0438\u0439 \u0441\u0430\u0439\u0442\u0443, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u0435\u0440\u0435\u0445\u043e\u0434.<\/p>\n<\/li>\n<li>\n<p><strong>Third-party<\/strong>\u00a0cookies \u2014 \u0444\u0430\u0439\u043b\u044b cookie \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u0445 \u0441\u0430\u0439\u0442\u043e\u0432, \u0440\u0430\u0437\u043c\u0435\u0449\u0430\u044e\u0449\u0438\u0445 \u0441\u0432\u043e\u0439 \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435.<\/p>\n<\/li>\n<\/ul>\n<p>\u0422\u0438\u043f\u044b Cookie \u043f\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u0436\u0438\u0437\u043d\u0438:<\/p>\n<ul>\n<li>\n<p><strong>Session<\/strong>\u00a0cookies \u2014 \u0443\u0434\u0430\u043b\u044f\u044e\u0442\u0441\u044f \u043f\u0440\u0438 \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u0438 \u0440\u0430\u0431\u043e\u0442\u044b \u043a\u043b\u0438\u0435\u043d\u0442\u0430 (\u0437\u0430\u043a\u0440\u044b\u0442\u0438\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430). \u041e\u0434\u043d\u0430\u043a\u043e \u0432\u0435\u0431-\u0431\u0440\u0430\u0443\u0437\u0435\u0440\u044b \u043c\u043e\u0433\u0443\u0442 \u0432\u043e\u0441\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u0441\u0435\u0430\u043d\u0441 \u043f\u043e\u0441\u043b\u0435 \u0437\u0430\u043a\u0440\u044b\u0442\u0438\u044f \u0438 \u0432\u043e\u0441\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c session cookie.<\/p>\n<\/li>\n<li>\n<p><strong>Permanent<\/strong>\u00a0cookies \u2014 \u0443\u0434\u0430\u043b\u044f\u044e\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e \u0438\u0441\u0442\u0435\u0447\u0435\u043d\u0438\u044e \u0441\u0440\u043e\u043a\u0430 (Max-Age) \u0438\u043b\u0438 \u0432 \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u0443\u044e \u0434\u0430\u0442\u0443 (Expires).<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b Cookie:<\/p>\n<ul>\n<li>\n<p>name \u2014 \u0437\u0430\u0434\u0430\u0451\u0442 \u0438\u043c\u044f cookie-\u0444\u0430\u0439\u043b\u0430<\/p>\n<\/li>\n<li>\n<p>value \u2014 \u0445\u0440\u0430\u043d\u0438\u043c\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 cookie-\u0444\u0430\u0439\u043b\u0430 (\u0434\u043b\u044f \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0438\u043b\u0438 \u0434\u043b\u044f \u0441\u043b\u0443\u0436\u0435\u0431\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438)<\/p>\n<\/li>\n<li>\n<p>expires \u2014 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u0441\u0440\u043e\u043a \u0436\u0438\u0437\u043d\u0438 cookie-\u0444\u0430\u0439\u043b\u0430 \u0434\u043e \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u043e\u0439 \u0434\u0430\u0442\u044b<\/p>\n<\/li>\n<li>\n<p>max-age \u2014 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u0441\u0440\u043e\u043a \u0436\u0438\u0437\u043d\u0438 cookie-\u0444\u0430\u0439\u043b\u0430 \u043f\u043e \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u043e\u043c\u0443 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 (\u0432 \u0441\u0435\u043a\u0443\u043d\u0434\u0430\u0445)<\/p>\n<\/li>\n<li>\n<p>path \u2014 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u043f\u0443\u0442\u044c \u043a \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438 \u043d\u0430 \u0441\u0435\u0440\u0432\u0435\u0440\u0435<\/p>\n<\/li>\n<li>\n<p>domain \u2014 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442, \u043a\u0430\u043a\u043e\u0439 \u0434\u043e\u043c\u0435\u043d \u0431\u0443\u0434\u0435\u0442 \u0438\u043c\u0435\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u044d\u0442\u043e\u043c\u0443 cookie-\u0444\u0430\u0439\u043b\u0443<\/p>\n<\/li>\n<li>\n<p>secure \u2014 \u043e\u0431\u044f\u0437\u044b\u0432\u0430\u0435\u0442 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c cookie \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e HTTPS<\/p>\n<\/li>\n<li>\n<p>httponly \u2014 \u0437\u0430\u043f\u0440\u0435\u0449\u0430\u0435\u0442 \u043f\u043e\u043b\u0443\u0447\u0430\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a cookie \u0447\u0435\u0440\u0435\u0437 API \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 (document.cookie)<\/p>\n<\/li>\n<li>\n<p>samesite \u2014 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0438 cookie \u0447\u0435\u0440\u0435\u0437 \u043c\u0435\u0436\u0441\u0430\u0439\u0442\u043e\u0432\u044b\u0435 \u0437\u0430\u043f\u0440\u043e\u0441\u044b (&#171;none&#187;, &#171;lax&#187;, &#171;strict&#187;)<\/p>\n<\/li>\n<\/ul>\n<h4>Web-storage<\/h4>\n<p>Web-Storage (&#171;Web-\u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0435&#187;, &#171;DOM-\u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0435&#187;) \u2014 \u044d\u0442\u043e \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u043e \u043e\u0442\u0432\u0435\u0434\u0451\u043d\u043d\u043e\u0435 \u043c\u0435\u0441\u0442\u043e, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u0445\u0440\u0430\u043d\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445 \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435.<\/p>\n<p>\u0422\u0430\u043a\u0438\u0445 \u043c\u0435\u0441\u0442 \u0434\u0432\u0430:<\/p>\n<ul>\n<li>\n<p><strong>Session Storage<\/strong>\u00a0(&#171;\u0421\u0435\u0441\u0441\u0438\u043e\u043d\u043d\u043e\u0435 \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0435&#187;) \u2014 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0445\u0440\u0430\u043d\u0438\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0434\u043e\u043c\u0435\u043d\u0430, \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0435 \u043d\u0430 \u043f\u0440\u043e\u0442\u044f\u0436\u0435\u043d\u0438\u0438 \u0441\u0435\u0441\u0441\u0438\u0438, \u0434\u043e \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u043a\u043b\u0438\u0435\u043d\u0442\u0430 (\u0437\u0430\u043a\u0440\u044b\u0442\u0438\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430).<\/p>\n<\/li>\n<\/ul>\n<ul>\n<li>\n<p><strong>Local Storage<\/strong>\u00a0(&#171;\u041b\u043e\u043a\u0430\u043b\u044c\u043d\u043e\u0435 \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0435&#187;) \u2014 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0445\u0440\u0430\u043d\u0438\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0434\u043e\u043c\u0435\u043d\u0430, \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0435 \u0432 \u0442\u0435\u0447\u0435\u043d\u0438\u0435 \u043d\u0435\u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438, \u0434\u043e \u0443\u0434\u0430\u043b\u0435\u043d\u0438\u044f \u0438\u0445 \u0432\u0440\u0443\u0447\u043d\u0443\u044e.<\/p>\n<\/li>\n<\/ul>\n<p>\u0412 Session Storage \u0438 Local Storage \u0445\u0440\u0430\u043d\u044f\u0442\u0441\u044f \u043f\u0430\u0440\u044b &#171;Key&#187; \u0438 &#171;Value&#187; (\u043a\u043b\u044e\u0447 \u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043a\u043b\u044e\u0447\u0430).<\/p>\n<p>\u0421\u0440\u0430\u0432\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u0442\u0430\u0431\u043b\u0438\u0446\u0430 \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043a \u0434\u043b\u044f Local Storage, Session Storage \u0438 Cookies:<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<th>\n<\/th>\n<th>\n<p>Local Storage<\/p>\n<\/th>\n<th>\n<p>Session Storage<\/p>\n<\/th>\n<th>\n<p>Cookies<\/p>\n<\/th>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0412\u043c\u0435\u0441\u0442\u0438\u043c\u043e\u0441\u0442\u044c \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0430<\/p>\n<\/td>\n<td>\n<p align=\"left\">5-10 \u041c\u0431<\/p>\n<\/td>\n<td>\n<p align=\"left\">5-10 \u041c\u0431<\/p>\n<\/td>\n<td>\n<p align=\"left\">4 \u041a\u0431<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0425\u0440\u0430\u043d\u0438\u0442\u0441\u044f \u043d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u043a\u043b\u0438\u0435\u043d\u0442<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u043a\u043b\u0438\u0435\u043d\u0442<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u043a\u043b\u0438\u0435\u043d\u0442-\u0441\u0435\u0440\u0432\u0435\u0440<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u041c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0437\u0430\u0431\u043b\u043e\u043a\u0438\u0440\u043e\u0432\u0430\u043d \u043d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430<\/p>\n<\/td>\n<td>\n<p align=\"left\">+<\/p>\n<\/td>\n<td>\n<p align=\"left\">+<\/p>\n<\/td>\n<td>\n<p align=\"left\">+<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u041c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043e\u0442\u0440\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d \u043d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430<\/p>\n<\/td>\n<td>\n<p align=\"left\">+<\/p>\n<\/td>\n<td>\n<p align=\"left\">+<\/p>\n<\/td>\n<td>\n<p align=\"left\">+<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u041f\u0435\u0440\u0435\u0434\u0430\u0447\u0430 \u0447\u0435\u0440\u0435\u0437 HTTP \u0437\u0430\u043f\u0440\u043e\u0441<\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212;<\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212;<\/p>\n<\/td>\n<td>\n<p align=\"left\">+<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u041f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0430 SSL<\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212;<\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212;<\/p>\n<\/td>\n<td>\n<p align=\"left\">+<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0410\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0441\u0440\u043e\u043a\u0430 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f<\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212;<\/p>\n<\/td>\n<td>\n<p align=\"left\">+<\/p>\n<\/td>\n<td>\n<p align=\"left\">+<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\">\u0412\u0440\u0435\u043c\u044f \u0436\u0438\u0437\u043d\u0438<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0414\u043e \u0443\u0434\u0430\u043b\u0435\u043d\u0438\u044f \u0432\u0440\u0443\u0447\u043d\u0443\u044e<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0414\u043e \u0437\u0430\u043a\u0440\u044b\u0442\u0438\u044f \u0432\u043a\u043b\u0430\u0434\u043a\u0438 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0412 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0438 \u0441 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u043c TTL<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u043f\u0440\u0438\u043c\u0435\u0440\u043e\u0432 \u0445\u043e\u0447\u0435\u0442\u0441\u044f \u043e\u0442\u043c\u0435\u0442\u0438\u0442\u044c \u0442\u0430\u043a\u0438\u0435 \u0432\u0438\u0434\u044b \u0445\u0440\u0430\u043d\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445, \u043a\u0430\u043a:<\/p>\n<ul>\n<li>\n<p><strong>HTTP ETag<\/strong>\u00a0\u2014 \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c \u043a\u044d\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f HTTP, \u0441\u0432\u043e\u0435\u0433\u043e \u0440\u043e\u0434\u0430 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u0438\u0441\u0432\u0430\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0444\u0430\u0439\u043b\u0443 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c \u0434\u043b\u044f \u043f\u043e\u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u0439 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438.<\/p>\n<\/li>\n<li>\n<p><strong>IndexedDB<\/strong>\u00a0\u2014 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u0430\u044f \u0431\u0430\u0437\u0430 \u0434\u0430\u043d\u043d\u044b\u0445, \u0431\u043b\u0438\u0437\u043a\u0430\u044f \u043a NoSQL \u0442\u0438\u043f\u0443 \u0411\u0414.<\/p>\n<\/li>\n<li>\n<p><strong>WebSQL<\/strong>\u00a0\u2014 \u044d\u0442\u043e \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0435, \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u043e\u0435 \u043d\u0430 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438 SQLite (\u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u0443\u0441\u0442\u0430\u0440\u0435\u0432\u0448\u0438\u043c \u0432\u0438\u0434\u043e\u043c).<\/p>\n<\/li>\n<li>\n<p><strong>Client-side Storage\u00a0<\/strong>(&#171;\u0425\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439&#187;)<strong>\u00a0<\/strong>\u2014 \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0430, \u0440\u0430\u0441\u043f\u043e\u043b\u0430\u0433\u0430\u044e\u0449\u0438\u0435\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u0432 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, \u043d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 (\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;Local Shared Objects&#187;, &#171;Isolated Storage&#187;, &#171;Java persistence API&#187;).<\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/details>\n<hr\/>\n<p><a class=\"anchor\" name=\"nagruzka\" id=\"nagruzka\"><\/a><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td data-colwidth=\"255\" width=\"255\">\n<p align=\"left\"><strong>\u041e\u0431\u043b\u0430\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"255\" width=\"255\">\n<p align=\"left\"><strong>\u041a\u043b\u0430\u0441\u0441<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041d\u0430\u0433\u0440\u0443\u0437\u043a\u0430<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"255\" width=\"255\">\n<p align=\"left\"><strong>\u041e\u0431\u044a\u0435\u043a\u0442\u044b<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212; Network<br \/>&#8212; RAM<br \/>&#8212; CPU<br \/>&#8212; GPU<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<ul>\n<li>\n<p>\u0413\u043e\u0432\u043e\u0440\u044f \u043e \u0442\u0430\u043a\u043e\u043c \u044f\u0432\u043b\u0435\u043d\u0438\u0438 \u043a\u0430\u043a Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u043c\u044b \u0434\u043e\u043b\u0436\u043d\u044b \u043f\u043e\u043c\u043d\u0438\u0442\u044c \u043e \u043f\u043e\u0442\u0440\u0435\u0431\u043b\u0435\u043d\u0438\u0438 \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u044f \u043f\u0440\u0438 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c, \u043e \u043d\u0430\u043b\u0438\u0447\u0438\u0438 \u0432\u044b\u0441\u043e\u043a\u043e\u0441\u043a\u043e\u0440\u043e\u0441\u0442\u043d\u043e\u0433\u043e \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u043a \u0441\u0435\u0442\u0438 \u0438\u043d\u0442\u0435\u0440\u043d\u0435\u0442, \u043e\u0431 \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u0438 \u0441\u0435\u0440\u0432\u0438\u0441\u0430 \u0434\u043b\u044f \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u043d\u0438\u043c.<\/p>\n<\/li>\n<li>\n<p>\u0421\u0430\u043c\u044b\u043c \u0432\u0430\u0436\u043d\u044b\u043c \u0438 \u043e\u0441\u043d\u043e\u0432\u043e\u043f\u043e\u043b\u0430\u0433\u0430\u044e\u0449\u0438\u043c \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u043c \u0437\u0434\u0435\u0441\u044c \u0432\u044b\u0441\u0442\u0443\u043f\u0430\u0435\u0442 \u0434\u043e\u0441\u0442\u0443\u043f \u0432 \u0441\u0435\u0442\u044c. \u041e\u0442 \u044d\u0442\u043e\u0433\u043e \u0432 \u043f\u0440\u0438\u043d\u0446\u0438\u043f\u0435 \u0437\u0430\u0432\u0438\u0441\u0438\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043a\u0430\u043a \u0442\u0430\u043a\u043e\u0432\u0430\u044f. \u041d\u0435 \u0431\u0443\u0434\u0435\u0442 \u0441\u0435\u0442\u0438 \u2014 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u043d\u0435 \u0441\u043c\u043e\u0436\u0435\u0442 \u0441\u043e\u0435\u0434\u0438\u043d\u0438\u0442\u044c\u0441\u044f \u0441 \u0441\u0435\u0440\u0432\u0435\u0440\u043e\u043c.<\/p>\n<\/li>\n<li>\n<p>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043a\u0438 \u0441\u0435\u0442\u0435\u0432\u043e\u0433\u043e \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f:<\/p>\n<ul>\n<li>\n<p>\u0421\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u0441\u0435\u0442\u0438 (Condition\/Quality) \u2014 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e\u0441\u0442\u044c \u0438 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u043e \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u043e\u043f\u0443\u0441\u043a\u043d\u0430\u044f \u0441\u043f\u043e\u0441\u043e\u0431\u043d\u043e\u0441\u0442\u044c (Download\/Upload) \u2014 \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u044b\u0439 \u043e\u0431\u044a\u0435\u043c \u0434\u0430\u043d\u043d\u044b\u0445, \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0445 \u0441\u0435\u0442\u044c\u044e \u0432 \u0435\u0434\u0438\u043d\u0438\u0446\u0443 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 (\u041c\u0431\u0438\u0442\/\u0441, \u041a\u0431\u0438\u0442\/\u0441).<\/p>\n<\/li>\n<li>\n<p>\u0412\u0440\u0435\u043c\u044f \u0440\u0435\u0430\u043a\u0446\u0438\u0438 \u0441\u0435\u0442\u0438 (Ping\/Latency) \u2014 \u0432\u0440\u0435\u043c\u044f, \u0437\u0430\u0442\u0440\u0430\u0447\u0438\u0432\u0430\u0435\u043c\u043e\u0435 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u043d\u044b\u043c \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0435\u043d\u0438\u0435\u043c \u0438 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430\u043c\u0438 \u0441\u0435\u0442\u0438 \u043d\u0430 \u043f\u043e\u0434\u0433\u043e\u0442\u043e\u0432\u043a\u0443 \u043a \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0435 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 (\u043c\u0438\u043b\u043b\u0438\u0441\u0435\u043a\u0443\u043d\u0434\u044b).<\/p>\n<\/li>\n<li>\n<p>\u041a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0439 (Open Connections) \u2014 \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u043e\u0442\u043a\u0440\u044b\u0442\u044b\u0445 \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u0439 \u0438 \u043f\u043e\u0442\u0440\u0435\u0431\u043b\u0435\u043d\u0438\u0435 \u0442\u0440\u0430\u0444\u0438\u043a\u0430 \u0447\u0435\u0440\u0435\u0437 \u044d\u0442\u0438 \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p>\u041e\u0431\u0449\u0438\u0439 \u043e\u0431\u044a\u0435\u043c \u0442\u0440\u0430\u0444\u0438\u043a\u0430 (Traffic RX\/TX Statistic) \u2014 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0435\u043c\u043e\u0439 \u043f\u043e \u0441\u0435\u0442\u0438 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 (\u041a\u0438\u043b\u043e\u0431\u0430\u0439\u0442, \u041c\u0435\u0433\u0430\u0431\u0430\u0439\u0442).<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p>\u041a\u0430\u043a \u0443\u0436\u0435 \u0432\u044b\u044f\u0441\u043d\u0438\u043b\u0438, \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u044b \u0440\u0430\u0441\u043f\u043e\u043b\u0430\u0433\u0430\u044e\u0442 \u0434\u0435\u0431\u0430\u0436\u043d\u044b\u043c\u0438 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0430\u043c\u0438. \u0422\u0430\u043a\u0438 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u044d\u043c\u0443\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0441\u0435\u0442\u0435\u0432\u043e\u0433\u043e \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>Google Chrome Network Throttling:<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c DevTools \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 (F12 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e)<\/p>\n<\/li>\n<li>\n<p>\u041f\u0435\u0440\u0435\u0439\u0442\u0438 \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0443 &#171;Network&#187;<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/f39\/5ea\/4b4\/f395ea4b444163a3207573f74436ccbc.png\" width=\"1178\" height=\"54\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/f39\/5ea\/4b4\/f395ea4b444163a3207573f74436ccbc.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u0412 \u043e\u0442\u043a\u0440\u044b\u0432\u0448\u0435\u0439\u0441\u044f \u0432\u043a\u043b\u0430\u0434\u043a\u0435 \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u043e\u0434\u0438\u043d \u0438\u0437 \u043f\u0440\u0435\u0441\u0435\u0442\u043e\u0432 \u0434\u043b\u044f \u044d\u043c\u0443\u043b\u044f\u0446\u0438\u0438 \u0441\u0435\u0442\u0435\u0432\u043e\u0433\u043e \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f (&#171;Network Throttling&#187;)<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/460\/c2c\/65e\/460c2c65e2281c8384c54f5f00cd0dba.png\" width=\"684\" height=\"114\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/460\/c2c\/65e\/460c2c65e2281c8384c54f5f00cd0dba.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"4\">\n<li>\n<p>\u041a\u043e\u0433\u0434\u0430 \u0432\u043a\u043b\u044e\u0447\u0435\u043d\u0430 \u044d\u043c\u0443\u043b\u044f\u0446\u0438\u044f, \u043d\u0430 \u0432\u043a\u043b\u0430\u0434\u043a\u0435 &#171;Network&#187; \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0441\u0438\u0433\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u044e\u0449\u0438\u0439 \u0437\u043d\u0430\u0447\u043e\u043a \u0441 \u0436\u0451\u043b\u0442\u044b\u043c \u0442\u0440\u0435\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u043e\u043c (&#171;Network throttling is enabled&#187;)<\/p>\n<\/li>\n<\/ol>\n<p>\u0415\u0441\u043b\u0438 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0445 \u043f\u0440\u0435\u0441\u0435\u0442\u043e\u0432 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e, \u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043d\u043e\u0432\u044b\u0439, \u043d\u0430 \u0441\u0432\u043e\u0439 \u0432\u043a\u0443\u0441:<\/p>\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c \u043c\u0435\u043d\u044e &#171;Settings&#187; \u0432 DevTools<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/a4d\/975\/e3b\/a4d975e3ba4c40ba4debf28ab41121b6.png\" width=\"350\" height=\"56\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/a4d\/975\/e3b\/a4d975e3ba4c40ba4debf28ab41121b6.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"2\">\n<li>\n<p>\u041f\u0435\u0440\u0435\u0439\u0442\u0438 \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0443 &#171;Throttling&#187;<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430\u0436\u0430\u0442\u044c &#171;Add custom profile&#8230;&#187;<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/2bd\/d2e\/34e\/2bdd2e34e469639f22ca44df14252917.png\" width=\"1294\" height=\"520\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/2bd\/d2e\/34e\/2bdd2e34e469639f22ca44df14252917.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"4\">\n<li>\n<p>\u0417\u0430\u0434\u0430\u0451\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u0443\u044e \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u0441\u043a\u0430\u0447\u0438\u0432\u0430\u043d\u0438\u044f \u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438, \u0430 \u0442\u0430\u043a \u0436\u0435 \u0432\u0440\u0435\u043c\u044f \u043e\u0442\u043a\u043b\u0438\u043a\u0430<\/p>\n<\/li>\n<li>\n<p>\u0421\u043e\u0445\u0440\u0430\u043d\u044f\u0435\u043c \u043f\u0440\u0435\u0441\u0435\u0442 \u0447\u0435\u0440\u0435\u0437 &#171;Add&#187;<\/p>\n<\/li>\n<\/ol>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0422\u0430\u043a \u043a\u0430\u043a \u0434\u043b\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0442\u0430\u043a\u043e\u0435 \u041f\u041e \u043a\u0430\u043a \u0431\u0440\u0430\u0443\u0437\u0435\u0440, \u0442\u043e \u0434\u043b\u044f \u0435\u0433\u043e \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u0442\u0440\u0435\u0431\u0443\u044e\u0442\u0441\u044f \u0440\u0435\u0441\u0443\u0440\u0441\u044b \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430, \u0442\u0430\u043a\u0438\u0435 \u043a\u0430\u043a: CPU, RAM, GPU.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e \u043f\u0440\u0438\u043c\u0435\u0440\u0443 Google Chrome \u044d\u0442\u043e\u0442 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0440\u0430\u0437\u0431\u0438\u0432\u0430\u0435\u0442 \u043a\u0430\u0436\u0434\u0443\u044e \u0432\u043a\u043b\u0430\u0434\u043a\u0443\/\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443, \u043f\u043b\u0430\u0433\u0438\u043d \u0438\u043b\u0438 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435 \u043d\u0430 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u043f\u0440\u043e\u0446\u0435\u0441\u0441, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0437\u0430\u043d\u0438\u043c\u0430\u0435\u0442 \u043c\u0435\u0441\u0442\u043e \u0432 \u043e\u043f\u0435\u0440\u0430\u0442\u0438\u0432\u043d\u043e\u0439 \u043f\u0430\u043c\u044f\u0442\u0438 (RAM \u2014 &#171;Random Access Memory&#187;).<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0440 (CPU \u2014 &#171;Central Processing Unit&#187;) \u0432 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043c\u044b\u0441\u043b\u0435 \u0431\u0443\u0434\u0435\u0442 \u043e\u0442\u0432\u0435\u0447\u0430\u0442\u044c \u0437\u0430 \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u0443\u044e \u0440\u0430\u0431\u043e\u0442\u0443 \u0441\u0430\u043c\u043e\u0433\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0432 (\u0437\u0430\u0434\u0430\u0447), \u0438\u043c \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0445.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u043c\u0438\u043c\u043e \u0432\u043a\u043b\u0430\u0434\u043e\u043a \u0441 Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430\u043c\u0438 \u0443 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u0435\u0441\u0442\u044c \u0438 \u0441\u0432\u043e\u0438 \u0441\u043b\u0443\u0436\u0435\u0431\u043d\u044b\u0435 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0442\u0430\u043a\u0436\u0435 \u043f\u043e\u0442\u0440\u0435\u0431\u043b\u044f\u044e\u0442 \u0440\u0435\u0441\u0443\u0440\u0441\u044b (UI Process, Render Process, Plugin Process &#8230;).<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0438 \u0441 \u044d\u043c\u0443\u043b\u044f\u0446\u0438\u0435\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u0441\u0435\u0442\u0438 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435 \u043c\u043e\u0436\u043d\u043e \u0438 \u044d\u043c\u0443\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0440\u0430\u0431\u043e\u0442\u0443 \u00ab\u043c\u0435\u0434\u043b\u0435\u043d\u043d\u043e\u0433\u043e\u00bb \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>Google Chrome CPU Throttling:<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c DevTools \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 (F12 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e)<\/p>\n<\/li>\n<li>\n<p>\u041f\u0435\u0440\u0435\u0439\u0442\u0438 \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0443 &#171;Performance&#187;<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/725\/fd5\/382\/725fd538245a205685648b7c05295d03.png\" width=\"944\" height=\"58\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/725\/fd5\/382\/725fd538245a205685648b7c05295d03.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u043d\u044b\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 (&#171;Capture Settings&#187;)<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/1f4\/b4b\/92b\/1f4b4b92b9e9aaf8a20897fd80e5e7c4.png\" width=\"650\" height=\"68\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/1f4\/b4b\/92b\/1f4b4b92b9e9aaf8a20897fd80e5e7c4.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"4\">\n<li>\n<p>\u0412\u044b\u0431\u0440\u0430\u0442\u044c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0439 \u043c\u0443\u043b\u044c\u0442\u0438\u043f\u043b\u0438\u043a\u0430\u0442\u043e\u0440 \u0434\u043b\u044f \u0437\u0430\u043c\u0435\u0434\u043b\u0435\u043d\u0438\u044f CPU<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/229\/7b2\/680\/2297b268073643a1d44c42508d1fad8f.png\" width=\"346\" height=\"108\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/229\/7b2\/680\/2297b268073643a1d44c42508d1fad8f.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0422\u0430\u043a\u0436\u0435 \u043c\u043e\u0436\u043d\u043e \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u0438\u0437 \u0443\u0436\u0435 \u0433\u043e\u0442\u043e\u0432\u044b\u0445 \u043f\u0440\u0435\u0441\u0435\u0442\u043e\u0432 \u00ab\u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u00bb \u0447\u0435\u0440\u0435\u0437 &#171;Toggle Device Bar&#187;. \u0422\u0430\u043a\u0438\u0445 \u043f\u0440\u0435\u0441\u0435\u0442\u043e\u0432 \u0434\u0432\u0430: &#171;Mid-tier mobile&#187; \u0438 &#171;Low-end mobile&#187;, \u043d\u043e \u0441\u0442\u043e\u0438\u0442 \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c, \u0447\u0442\u043e \u043f\u043e\u043c\u0438\u043c\u043e \u0437\u0430\u043c\u0435\u0434\u043b\u0435\u043d\u0438\u044f CPU \u0432 \u044d\u0442\u0438\u0445 \u043f\u0440\u0435\u0441\u0435\u0442\u0430\u0445 \u0432\u043a\u043b\u044e\u0447\u0435\u043d\u0430 \u044d\u043c\u0443\u043b\u044f\u0446\u0438\u044f \u0441\u0435\u0442\u0435\u0432\u043e\u0433\u043e \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/5d3\/869\/858\/5d386985834a92e48f2ab83ffce11cc8.png\" width=\"1106\" height=\"62\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/5d3\/869\/858\/5d386985834a92e48f2ab83ffce11cc8.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0427\u0435\u043c \u0431\u043e\u043b\u044c\u0448\u0435 \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043e\u043a\u043e\u043d \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u0438 \u0432\u043a\u043b\u0430\u0434\u043e\u043a \u0432 \u043d\u0451\u043c, \u0442\u0435\u043c \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0431\u043e\u043b\u044c\u0448\u0435 \u0438\u0434\u0451\u0442 \u043d\u0430\u0433\u0440\u0443\u0437\u043a\u0430 \u043d\u0430 RAM \u0438 CPU.<\/p>\n<\/li>\n<li>\n<p>\u0417\u0430 \u043f\u043e\u0442\u0440\u0435\u0431\u043b\u0435\u043d\u0438\u0435\u043c \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432 \u043c\u043e\u0436\u043d\u043e \u0441\u043b\u0435\u0434\u0438\u0442\u044c \u0447\u0435\u0440\u0435\u0437 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0439 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0434\u0438\u0441\u043f\u0435\u0442\u0447\u0435\u0440 \u0437\u0430\u0434\u0430\u0447.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u0414\u0438\u0441\u043f\u0435\u0442\u0447\u0435\u0440 \u0437\u0430\u0434\u0430\u0447 \u0438 Performance monitor \u0432 Chrome:<\/summary>\n<div class=\"spoiler__content\">\n<h4>\u0414\u0438\u0441\u043f\u0435\u0442\u0447\u0435\u0440 \u0437\u0430\u0434\u0430\u0447<\/h4>\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c \u043c\u0435\u043d\u044e \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430<\/p>\n<\/li>\n<li>\n<p>\u041f\u0435\u0440\u0435\u0439\u0442\u0438 \u0432 \u043f\u0443\u043d\u043a\u0442 \u043c\u0435\u043d\u044e \u00ab\u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b\u00bb<\/p>\n<\/li>\n<li>\n<p>\u0412\u044b\u0431\u0440\u0430\u0442\u044c \u00ab\u0414\u0438\u0441\u043f\u0435\u0442\u0447\u0435\u0440 \u0437\u0430\u0434\u0430\u0447\u00bb<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/16e\/428\/d1c\/16e428d1cbe335cd897dc0cb2fb166da.png\" width=\"754\" height=\"480\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/16e\/428\/d1c\/16e428d1cbe335cd897dc0cb2fb166da.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"4\">\n<li>\n<p>\u0417\u0434\u0435\u0441\u044c \u0432\u0441\u0451 \u043f\u043e\u0447\u0442\u0438 \u043a\u0430\u043a \u0438 \u0432 \u0434\u0438\u0441\u043f\u0435\u0442\u0447\u0435\u0440\u0435 \u0437\u0430\u0434\u0430\u0447 \u0434\u043b\u044f \u041e\u0421: \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0430, \u043f\u043e\u0442\u0440\u0435\u0431\u043b\u0435\u043d\u0438\u0435 \u0442\u0440\u0430\u0444\u0438\u043a\u0430, \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0430 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0440\u0430, \u043f\u043e\u0442\u0440\u0435\u0431\u043b\u0435\u043d\u0438\u0435 \u043e\u043f\u0435\u0440\u0430\u0442\u0438\u0432\u043d\u043e\u0439 \u043f\u0430\u043c\u044f\u0442\u0438<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/600\/934\/0ae\/6009340ae21ab0584d1c814ee2950886.png\" alt=\"\" title=\"\" width=\"1016\" height=\"398\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/600\/934\/0ae\/6009340ae21ab0584d1c814ee2950886.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"5\">\n<li>\n<p>\u0422\u0430\u043a \u0436\u0435 \u043c\u043e\u0436\u043d\u043e \u0438 \u0437\u0430\u0432\u0435\u0440\u0448\u0438\u0442\u044c \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u044b\u0439 \u043f\u0440\u043e\u0446\u0435\u0441\u0441 (\u0437\u0430\u0434\u0430\u0447\u0443)<\/p>\n<\/li>\n<\/ol>\n<h4>Performance monitor<\/h4>\n<ol>\n<li>\n<p>\u0412 \u043d\u0438\u0436\u043d\u0435\u0439 \u0447\u0430\u0441\u0442\u0438 \u043a\u043e\u043d\u0441\u043e\u043b\u0438 DevTools \u043d\u0430\u0436\u0430\u0442\u044c \u043d\u0430 \u043c\u0435\u043d\u044e \u0438 \u0432\u044b\u0431\u0440\u0430\u0442\u044c &#171;Performance monitor&#187;<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/5ed\/145\/9fe\/5ed1459fe8cb1b969e181f766d5abf7f.png\" width=\"378\" height=\"818\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/5ed\/145\/9fe\/5ed1459fe8cb1b969e181f766d5abf7f.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"2\">\n<li>\n<p>\u041e\u0442\u043a\u0440\u043e\u0435\u0442\u0441\u044f \u0432\u043a\u043b\u0430\u0434\u043a\u0430, \u0433\u0434\u0435 \u0431\u0443\u0434\u0443\u0442 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0442\u044c\u0441\u044f \u043c\u0435\u0442\u0440\u0438\u043a\u0438 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/e84\/f1b\/043\/e84f1b04315f657bd6cc854d67d048a7.png\" width=\"1974\" height=\"768\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/e84\/f1b\/043\/e84f1b04315f657bd6cc854d67d048a7.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u041f\u0440\u0438 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u043c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u0430 \u0441\u0438\u043b\u044c\u043d\u0430\u044f \u043d\u0430\u0433\u0440\u0443\u0437\u043a\u0430, \u0438 \u043d\u0430 \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u044f\u0434\u0440\u043e (\u0443\u0441\u043a\u043e\u0440\u0438\u0442\u0435\u043b\u044c) (GPU \u2014 &#171;Graphic Processing Unit&#187;), \u043a\u043e\u0433\u0434\u0430 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0451\u043c\u043a\u0430\u044f \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u044f WebGL.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0435 \u0441\u0442\u043e\u0438\u0442 \u043f\u043e\u043b\u0430\u0433\u0430\u0442\u044c, \u0447\u0442\u043e GPU \u043d\u0435 \u0443\u0447\u0430\u0441\u0442\u0432\u0443\u0435\u0442 \u0432 \u0440\u0430\u0431\u043e\u0442\u0435 \u043f\u0440\u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b. \u0412\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u043a\u0430\u043a \u0440\u0430\u0437 \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u043c\u043e\u0449\u043d\u043e\u0441\u0442\u0438 GPU, \u043d\u043e \u0442\u0430\u043a\u043e\u0435 \u043f\u043e\u0442\u0440\u0435\u0431\u043b\u0435\u043d\u0438\u0435 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043d\u0435\u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u043c.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041a\u0430\u043a \u0432\u044b\u0432\u0435\u0441\u0442\u0438 \u0441\u0447\u0451\u0442\u0447\u0438\u043a FPS \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u044c \u043d\u0430\u0433\u0440\u0443\u0437\u043a\u0443 \u043d\u0430 GPU:<\/summary>\n<div class=\"spoiler__content\">\n<p><strong>FPS<\/strong>\u00a0(&#171;Frame per Second&#187;) \u2014 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u043a\u0430\u0434\u0440\u043e\u0432 \u0432 \u0441\u0435\u043a\u0443\u043d\u0434\u0443.<\/p>\n<ol>\n<li>\n<p>\u0412 \u043d\u0438\u0436\u043d\u0435\u0439 \u0447\u0430\u0441\u0442\u0438 \u043a\u043e\u043d\u0441\u043e\u043b\u0438 DevTools \u043d\u0430\u0436\u0430\u0442\u044c \u043d\u0430 \u043c\u0435\u043d\u044e \u0438 \u0432\u044b\u0431\u0440\u0430\u0442\u044c &#171;Rendering&#187;<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/dd4\/cce\/931\/dd4cce9316f05148e030f092ead81b9b.png\" width=\"372\" height=\"822\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/dd4\/cce\/931\/dd4cce9316f05148e030f092ead81b9b.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"2\">\n<li>\n<p>\u0412 \u043f\u043e\u044f\u0432\u0438\u0432\u0448\u0435\u0439\u0441\u044f \u0432\u043a\u043b\u0430\u0434\u043a\u0435 &#171;Rendering&#187; \u0432\u044b\u0431\u0440\u0430\u0442\u044c &#171;Frame Rendering Stats&#187;<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/4e3\/68b\/8c4\/4e368b8c4165a975eeedb09d0d74368e.png\" width=\"1430\" height=\"396\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/4e3\/68b\/8c4\/4e368b8c4165a975eeedb09d0d74368e.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u0412 \u0443\u0433\u043b\u0443 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043f\u043e\u044f\u0432\u0438\u0442\u0441\u044f \u0441\u0447\u0451\u0442\u0447\u0438\u043a FPS \u0438 \u043d\u0430\u0433\u0440\u0443\u0437\u043a\u0430 \u043d\u0430 \u043f\u0430\u043c\u044f\u0442\u044c GPU<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/a9c\/640\/8b9\/a9c6408b91aa4f01bac14d8e6477ca82.png\" width=\"398\" height=\"378\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/a9c\/640\/8b9\/a9c6408b91aa4f01bac14d8e6477ca82.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0422\u0430\u043a\u0436\u0435 \u0441\u0442\u043e\u0438\u0442 \u0443\u043f\u043e\u043c\u044f\u043d\u0443\u0442\u044c \u043e \u0442\u043e\u043c, \u0447\u0442\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u0435\u0442 \u0444\u0430\u0439\u043b\u044b \u0432 cache \u043d\u0430 \u0434\u0438\u0441\u043a\u0435, \u0438 \u043e\u0442 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u0438 \u0440\u0430\u0431\u043e\u0442\u044b \u044d\u0442\u043e\u0433\u043e \u0434\u0438\u0441\u043a\u0430 \u0431\u0443\u0434\u0435\u0442 \u0437\u0430\u0432\u0438\u0441\u0435\u0442\u044c \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u043e\u0431\u043c\u0435\u043d\u0430 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u0441 \u043a\u044d\u0448\u0435\u043c (\u043d\u043e \u044d\u0442\u043e \u0443\u0436\u0435 \u0441\u043e\u0432\u0441\u0435\u043c \u0440\u0435\u0434\u043a\u0438\u0439 \u043a\u0435\u0439\u0441).<\/p>\n<\/li>\n<li>\n<p>\u0417\u0430 \u0437\u0430\u043c\u0435\u0440 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 \u043f\u0440\u0438 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u0439, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432\u0441\u0451 \u0432 \u0442\u043e\u043c \u0436\u0435 Chrome DevTools, \u043e\u0442\u0432\u0435\u0447\u0430\u0435\u0442 \u0432\u043a\u043b\u0430\u0434\u043a\u0430 &#171;Perfomance&#187;.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041a\u0440\u0430\u0442\u043a\u0438\u0439 \u044d\u043a\u0441\u043a\u0443\u0440\u0441 \u0432 \u0437\u0430\u043c\u0435\u0440\u044b \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 \u0438 \u0437\u0430\u043f\u0443\u0441\u043a \u043f\u0440\u043e\u0444\u0438\u043b\u0438\u0440\u043e\u0432\u0449\u0438\u043a\u0430:<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c DevTools \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 (F12 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e)<\/p>\n<\/li>\n<li>\n<p>\u041f\u0435\u0440\u0435\u0439\u0442\u0438 \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0443 &#171;Performance&#187;<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/e2a\/7f9\/583\/e2a7f9583611a5d945da7f13b1b5c075.png\" width=\"944\" height=\"58\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/e2a\/7f9\/583\/e2a7f9583611a5d945da7f13b1b5c075.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u041d\u0430\u0436\u0430\u0442\u044c \u043a\u043d\u043e\u043f\u043a\u0443 &#171;Record&#187;<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/1f5\/3ba\/b38\/1f53bab389d230c40d19b6f2f87dc47d.png\" width=\"644\" height=\"108\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/1f5\/3ba\/b38\/1f53bab389d230c40d19b6f2f87dc47d.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"4\">\n<li>\n<p>\u0412\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0441\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u0439 \u043f\u043e \u0437\u0430\u0440\u0430\u043d\u0435\u0435 \u0437\u0430\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u043d\u043e\u043c\u0443 \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u044e \u0438\u043b\u0438 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0438\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f (\u043f\u043e\u043a\u0430 \u0438\u0434\u0451\u0442 \u0437\u0430\u043f\u0438\u0441\u044c)<\/p>\n<\/li>\n<li>\n<p>\u041e\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u0437\u0430\u043f\u0438\u0441\u044c \u043f\u0440\u043e\u0444\u0438\u043b\u0438\u0440\u043e\u0432\u0449\u0438\u043a\u0430, \u043a\u043e\u0433\u0434\u0430 \u044d\u0442\u043e \u043f\u043e\u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/750\/78b\/07a\/75078b07a0cdcbf3699a234e28091f82.png\" width=\"670\" height=\"258\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/750\/78b\/07a\/75078b07a0cdcbf3699a234e28091f82.png\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"6\">\n<li>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e \u043a\u0430\u043a \u043f\u0440\u043e\u0444\u0438\u043b\u0438\u0440\u043e\u0432\u0449\u0438\u043a \u043f\u0440\u043e\u0430\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u0435\u0442 \u0432\u0441\u0435 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u043d\u044b\u0435 \u0441\u0432\u0435\u0434\u0435\u043d\u0438\u044f, \u043f\u043e\u044f\u0432\u0438\u0442\u0441\u044f \u0441\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0430 \u043f\u043e \u0434\u0430\u043d\u043d\u043e\u043c\u0443 \u0437\u0430\u043c\u0435\u0440\u0443<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/472\/269\/8d0\/4722698d08fc4db48bc799eb59b8db62.png\" width=\"1548\" height=\"1470\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/472\/269\/8d0\/4722698d08fc4db48bc799eb59b8db62.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041d\u0430 \u0447\u0442\u043e \u043e\u0431\u0440\u0430\u0449\u0430\u0442\u044c \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u0432 \u0442\u0430\u043a\u0438\u0445 \u043e\u0442\u0447\u0451\u0442\u0430\u0445:<\/p>\n<ul>\n<li>\n<p>\u043d\u0430 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u043a\u0430\u0434\u0440\u043e\u0432 \u0432 \u0441\u0435\u043a\u0443\u043d\u0434\u0443 (&#171;FPS&#187;)<\/p>\n<\/li>\n<li>\n<p>\u043d\u0430 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u0435 \u0441\u043f\u0430\u0439\u043a\u0438 (\u0440\u0435\u0437\u043a\u0438\u0435 \u043e\u0434\u043d\u043e\u043c\u043e\u043c\u0435\u043d\u0442\u043d\u044b\u0435 \u0441\u043a\u0430\u0447\u043a\u0438) \u2014 &#171;CPU&#187;, &#171;Memory&#187;, &#171;Heap&#187;<\/p>\n<\/li>\n<li>\n<p>\u043d\u0430 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0443 \u0432 \u00ab\u043f\u043e\u0442\u043e\u043b\u043e\u043a\u00bb (&#171;CPU&#187;, &#171;Memory&#187;, &#171;Heap&#187;)<\/p>\n<\/li>\n<li>\n<p>\u043d\u0430 \u0437\u0430\u0432\u044b\u0448\u0435\u043d\u043d\u043e\u0435 \u043f\u043e\u0442\u0440\u0435\u0431\u043b\u0435\u043d\u0438\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432 \u043f\u0440\u0438 \u0440\u044f\u0434\u043e\u0432\u044b\u0445 \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u044f\u0445<\/p>\n<\/li>\n<li>\n<p>\u043d\u0430 \u043f\u043e\u0442\u0440\u0435\u0431\u043b\u0435\u043d\u0438\u044f \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432 \u0432 \u043c\u043e\u043c\u0435\u043d\u0442\u044b \u043f\u0440\u043e\u0441\u0442\u043e\u044f<\/p>\n<\/li>\n<li>\n<p>\u043d\u0430 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432 \u0432 \u0434\u0435\u0440\u0435\u0432\u0435 \u0432\u044b\u0437\u043e\u0432\u043e\u0432 (&#171;Call Tree&#187;)<\/p>\n<\/li>\n<\/ul>\n<p>\u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0444\u0438\u043b\u0438\u0440\u043e\u0432\u0449\u0438\u043a\u0430:<\/p>\n<ul>\n<li>\n<p>\u0417\u0430\u043f\u0438\u0441\u044c \u043f\u043e\u0441\u043b\u0435 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b &#171;Start profiling and reload page&#187;<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/630\/b21\/0c7\/630b210c70652af936fe188ff86dbcda.png\" width=\"304\" height=\"64\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/630\/b21\/0c7\/630b210c70652af936fe188ff86dbcda.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u0442\u044c \u0438 \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0442\u044c \u0441\u043d\u044f\u0442\u044b\u0435 \u0437\u0430\u043c\u0435\u0440\u044b \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/b32\/d44\/876\/b32d448762678d918f8e48d2543d3dce.png\" width=\"316\" height=\"62\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/b32\/d44\/876\/b32d448762678d918f8e48d2543d3dce.png\"\/><figcaption><\/figcaption><\/figure>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/0e7\/326\/3ac\/0e73263ac086e18177901ce671a9550a.png\" width=\"240\" height=\"130\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/0e7\/326\/3ac\/0e73263ac086e18177901ce671a9550a.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0417\u0430\u0445\u0432\u0430\u0442 \u0441\u043a\u0440\u0438\u043d\u0448\u043e\u0442\u043e\u0432 \u043f\u0440\u0438 \u0437\u0430\u043f\u0438\u0441\u0438 (&#171;Capture Screenshots&#187;)<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/707\/4a5\/92b\/7074a592b73250488ebca1ef7080d60b.png\" width=\"1222\" height=\"66\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/707\/4a5\/92b\/7074a592b73250488ebca1ef7080d60b.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0412\u044b\u0431\u043e\u0440 \u0440\u0430\u0437\u043d\u044b\u0445 \u0437\u0430\u043f\u0438\u0441\u0435\u0439 \u0434\u043b\u044f \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u044f (&#171;Show recent timeline sessions&#187;)<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/93d\/4af\/765\/93d4af765aa5dc1fb88f27ee0fd0eea5.png\" width=\"1096\" height=\"540\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/93d\/4af\/765\/93d4af765aa5dc1fb88f27ee0fd0eea5.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u041e\u0434\u043d\u0430\u043a\u043e \u044d\u0442\u043e \u0432\u0441\u0451 \u2014 \u0432\u043d\u0435\u0448\u043d\u0438\u0435 \u043f\u0440\u0438\u0437\u043d\u0430\u043a\u0438 \u043e\u0446\u0435\u043d\u043a\u0438 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438, \u0441\u043a\u0430\u0436\u0435\u043c \u0442\u0430\u043a, \u043d\u0430 \u043a\u043e\u043d\u0435\u0447\u043d\u043e\u043c \u043a\u043b\u0438\u0435\u043d\u0442\u0435. \u0421\u0442\u043e\u0438\u0442 \u043f\u043e\u043c\u043d\u0438\u0442\u044c, \u0447\u0442\u043e Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0440\u0430\u0437\u0432\u0451\u0440\u043d\u0443\u0442\u043e \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u0439 \u0438\u043d\u0444\u0440\u0430\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0435, \u0441 Web-\u0441\u0435\u0440\u0432\u0435\u0440\u0430\u043c\u0438, \u0421\u0423\u0411\u0414, \u043d\u0430 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0445\u043e\u0441\u0442\u0430\u0445, \u0432 \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0430\u0445 \u0432\u0438\u0440\u0442\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438, \u0438 \u0443 \u0432\u0441\u0435\u0433\u043e \u044d\u0442\u043e\u0433\u043e \u0442\u0430\u043a\u0436\u0435 \u0435\u0441\u0442\u044c \u0440\u0435\u0441\u0443\u0440\u0441\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u0442\u0440\u0435\u0431\u043b\u044f\u044e\u0442 \u044d\u0442\u0438 \u0441\u0430\u043c\u044b\u0435 \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u0434\u043b\u044f \u0441\u0432\u043e\u0435\u0439 \u0440\u0430\u0431\u043e\u0442\u044b. \u0418 \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u043e\u0441\u0442\u044c, \u0441\u043a\u0430\u0436\u0435\u043c, Frontend \u0447\u0430\u0441\u0442\u0438 \u0438\u043b\u0438 Backend \u0447\u0430\u0441\u0442\u0438 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e \u0437\u0430\u0432\u0438\u0441\u0438\u0442 \u043e\u0442 \u0434\u043e\u0441\u0442\u0430\u0442\u043a\u0430 \u044d\u0442\u0438\u0445 \u0441\u0430\u043c\u044b\u0445 \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432. \u041d\u043e \u043a\u0430\u043a \u043f\u0440\u0430\u0432\u0438\u043b\u043e \u044d\u0442\u0438\u043c \u0437\u0430\u0432\u0435\u0434\u0443\u044e\u0442 DevOps-\u0438\u043d\u0436\u0435\u043d\u0435\u0440\u044b, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0434\u0430\u043d\u043d\u044b\u0439 \u043f\u0443\u043d\u043a\u0442 \u0442\u0443\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0441\u043f\u0440\u0430\u0432\u043a\u0438.<\/p>\n<\/li>\n<li>\n<p>\u0412\u0438\u0434\u044b \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0442\u044c\u0441\u044f:<\/p>\n<ul>\n<li>\n<p>\u0422\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 (\u0432 \u0440\u0430\u043c\u043a\u0438 \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u0432\u0445\u043e\u0434\u044f\u0442: \u041d\u0430\u0433\u0440\u0443\u0437\u043e\u0447\u043d\u043e\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435, \u041a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u043e\u043d\u043d\u043e\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435, \u0422\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u043e\u0441\u0442\u0438\/\u043d\u0430\u0434\u0451\u0436\u043d\u043e\u0441\u0442\u0438, \u0421\u0442\u0440\u0435\u0441\u0441-\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0438 \u0442.\u0434)<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<hr\/>\n<p><a class=\"anchor\" name=\"instrumenty\" id=\"instrumenty\"><\/a><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td data-colwidth=\"255\" width=\"255\">\n<p align=\"left\"><strong>\u041e\u0431\u043b\u0430\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0422\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"255\" width=\"255\">\n<p align=\"left\"><strong>\u041a\u043b\u0430\u0441\u0441<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"255\" width=\"255\">\n<p align=\"left\"><strong>\u041e\u0431\u044a\u0435\u043a\u0442\u044b<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212; \u0412\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440<br \/>&#8212; \u0420\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f \u0434\u043b\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430<br \/>&#8212; \u041f\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u043c\u044b\u0435 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e<br \/>&#8212; \u041a\u043e\u043d\u0441\u043e\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043c\u0430\u043d\u0434\u044b<br \/>&#8212; \u0412\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0438\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u0438<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>\u0421\u043f\u0438\u0441\u043e\u043a \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u043c\u043e\u0433\u0430\u044e\u0442 \u0432 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438 Web&#8217;\u0430. \u0422\u0443\u0442 \u0431\u0435\u0437 \u043a\u0430\u043a\u0438\u0445-\u043b\u0438\u0431\u043e \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e\u0441\u0442\u0435\u0439, \u043f\u0440\u043e\u0441\u0442\u043e \u043a\u0440\u0430\u0442\u043a\u043e\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u043e\u0433\u043e \u041f\u041e \u0441\u043e \u0441\u0441\u044b\u043b\u043a\u043e\u0439 \u043d\u0430 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044e (\u0442.\u043a. \u043f\u043e \u043a\u0430\u0436\u0434\u043e\u043c\u0443 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0443 \u043c\u043e\u0436\u043d\u043e \u0441\u043e\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u043f\u043e\u043b\u043d\u043e\u0446\u0435\u043d\u043d\u0443\u044e \u0441\u0442\u0430\u0442\u044c\u044e \u0441 \u043e\u0431\u043b\u0430\u0441\u0442\u044c\u044e \u0435\u0433\u043e \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u044f, \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u043c\u0438 \u043f\u0440\u0438\u043c\u0435\u0440\u0430\u043c\u0438 \u0438 \u0442.\u0434.).<\/p>\n<details class=\"spoiler\">\n<summary>\u0412\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:<\/summary>\n<div class=\"spoiler__content\">\n<p>\u041d\u0430\u0432\u0435\u0440\u043d\u043e\u0435, \u0441\u0430\u043c\u044b\u0439 \u0432\u0430\u0436\u043d\u044b\u0439 \u0438 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u0439 \u0432\u0438\u0434 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0430 \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f Web. \u0421\u043f\u0435\u043a\u0442\u0440 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0435\u0439 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0448\u0438\u0440\u043e\u043a, \u043e\u0442 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043e\u0448\u0438\u0431\u043e\u043a \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u0438 \u0438 \u0437\u0430\u0445\u0432\u0430\u0442\u0430 HTTP \u0442\u0440\u0430\u0444\u0438\u043a\u0430, \u0434\u043e \u0437\u0430\u043c\u0435\u0440\u0430 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 \u0438 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u043b\u043e\u0433\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0438\u0441\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435 JS \u043a\u043e\u0434\u0430. \u0412 \u043b\u044e\u0431\u043e\u043c \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u043c \u0434\u0435\u0441\u043a\u0442\u043e\u043f\u043d\u043e\u043c \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435 \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u0442\u0430\u043a\u043e\u0439 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442. \u041f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u0435\u0441\u044c \u0433\u0430\u0439\u0434\u043b\u0430\u0439\u043d \u0438\u0437 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0438 \u0431\u044b\u043b \u043e\u043f\u0438\u0441\u0430\u043d \u0441 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0435\u043c Chrome DevTools. \u041f\u043e \u0441\u0432\u043e\u0435\u043c\u0443 \u0432\u043d\u0435\u0448\u043d\u0435\u043c\u0443 \u0432\u0438\u0434\u0443 \u0438 \u043d\u0430\u0431\u043e\u0440\u0443 \u0444\u0443\u043d\u043a\u0446\u0438\u0439 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u043d\u044b\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432 +\/- \u0441\u0445\u043e\u0436\u0438 (\u0435\u0441\u043b\u0438 \u043d\u0435 \u0438\u0434\u0435\u043d\u0442\u0438\u0447\u043d\u044b).<\/p>\n<p>\u041d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043f\u0440\u0438\u043c\u0435\u0440\u043e\u0432 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0438\u0437 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432:<\/p>\n<ul>\n<li>\n<p><strong>Chrome DevTools<\/strong>\u00a0\u2014 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430, \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0439 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 Google Chrome.<\/p>\n<ul>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/developer.chrome.com\/docs\/devtools\">Chrome DevTools<\/a><\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041a\u0430\u043a \u043e\u0442\u043a\u0440\u044b\u0442\u044c<\/summary>\n<div class=\"spoiler__content\">\n<ul>\n<li>\n<p>\u041c\u0435\u043d\u044e \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u2192 \u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u2192 \u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/58b\/05c\/755\/58b05c755d43a6a9cf02b7bb3ad4a144.png\" width=\"357\" height=\"224\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/58b\/05c\/755\/58b05c755d43a6a9cf02b7bb3ad4a144.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0412\u044b\u0437\u0432\u0430\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u043d\u043e\u0435 \u043c\u0435\u043d\u044e \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u2192 \u041f\u0440\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043a\u043e\u0434:<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/b0e\/946\/622\/b0e946622776566e783bfa80a447ffee.png\" width=\"199\" height=\"215\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/b0e\/946\/622\/b0e946622776566e783bfa80a447ffee.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0413\u043e\u0440\u044f\u0447\u0438\u0435 \u043a\u043b\u0430\u0432\u0438\u0448\u0438 (\u0437\u0430\u0432\u0438\u0441\u0438\u0442 \u043e\u0442 \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u043e\u043d\u043d\u043e\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u044b) \u2014 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e &#171;F12&#187;<\/p>\n<\/li>\n<\/ul>\n<p>P.S. \u0421 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0433\u043e\u0440\u044f\u0447\u0438\u0445 \u043a\u043b\u0430\u0432\u0438\u0448 (&#171;cmd + shift + p&#187; \u043d\u0430 macOS) (&#171;ctrl + shift + p&#187; \u043d\u0430 Windows) \u043c\u043e\u0436\u043d\u043e \u0432\u044b\u0432\u0435\u0441\u0442\u0438 \u043f\u0430\u043d\u0435\u043b\u044c \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u0438 \u043f\u043e \u0432\u0441\u0435\u043c \u0440\u0430\u0437\u0434\u0435\u043b\u0430\u043c\/\u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u043c\/\u043e\u043f\u0446\u0438\u044f\u043c DevTools.<br \/><a href=\"https:\/\/developer.chrome.com\/docs\/devtools\/command-menu\">Command Menu<\/a>:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/093\/df6\/28e\/093df628ea74d67bf022e42d8c057c8d.png\" width=\"998\" height=\"664\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/093\/df6\/28e\/093df628ea74d67bf022e42d8c057c8d.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<p><strong>\u0412\u0435\u0431-\u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440<\/strong>\u00a0\u2014 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430, \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 Safari.<\/p>\n<ul>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/developer.apple.com\/library\/archive\/documentation\/AppleApplications\/Conceptual\/Safari_Developer_Guide\/Introduction\/Introduction.html#\/\/apple_ref\/doc\/uid\/TP40007874-CH1-SW1\">About Safari Web Inspector<\/a><\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041a\u0430\u043a \u043e\u0442\u043a\u0440\u044b\u0442\u044c:<\/summary>\n<div class=\"spoiler__content\">\n<ul>\n<li>\n<p>\u0421\u043f\u0435\u0440\u0432\u0430 \u043f\u043e\u043d\u0430\u0434\u043e\u0431\u0438\u0442\u0441\u044f \u0432\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043c\u0435\u043d\u044e &#171;\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430&#187;, Safari \u2192 \u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430 \u2192 \u0414\u043e\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f:<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/5e2\/625\/c2a\/5e2625c2add4204409f95f52b0514d32.png\" width=\"950\" height=\"444\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/5e2\/625\/c2a\/5e2625c2add4204409f95f52b0514d32.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u2192 \u041f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u0432\u0435\u0431-\u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440:<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/099\/e88\/714\/099e887143f58bcaf6bec54e1cac2e96.png\" width=\"457\" height=\"378\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/099\/e88\/714\/099e887143f58bcaf6bec54e1cac2e96.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0412\u044b\u0437\u0432\u0430\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u043d\u043e\u0435 \u043c\u0435\u043d\u044e \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u2192 \u041f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u043d\u044b\u0439 \u043a\u043e\u0434 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b (\u0438\u043b\u0438 &#171;\u041f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u043e\u0431\u044a\u0435\u043a\u0442&#187;):<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/83c\/99d\/e16\/83c99de163ab18b0febc9400e127cb9e.png\" width=\"267\" height=\"181\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/83c\/99d\/e16\/83c99de163ab18b0febc9400e127cb9e.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<p><strong>\u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0432\u0435\u0431-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430<\/strong>\u00a0\u2014 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430, \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0439 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 Firefox.<\/p>\n<ul>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/firefox-source-docs.mozilla.org\/devtools-user\/index.html\">Firefox DevTools User Docs<\/a><\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041a\u0430\u043a \u043e\u0442\u043a\u0440\u044b\u0442\u044c:<\/summary>\n<div class=\"spoiler__content\">\n<ul>\n<li>\n<p>\u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u2192 \u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u2192 \u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0432\u0435\u0431-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/f3b\/716\/13c\/f3b71613cd49230b4b63c995e4c3727a.png\" width=\"288\" height=\"179\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/f3b\/716\/13c\/f3b71613cd49230b4b63c995e4c3727a.png\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0412\u044b\u0437\u0432\u0430\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u043d\u043e\u0435 \u043c\u0435\u043d\u044e \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u2192 \u0418\u0441\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u044c<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/d24\/f55\/1a2\/d24f551a23226d1a67f895b3d6e56f8e.png\" width=\"325\" height=\"225\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d24\/f55\/1a2\/d24f551a23226d1a67f895b3d6e56f8e.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0412 \u0434\u043e\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435: \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0442 \u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 Google Chrome \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u00a0<a href=\"https:\/\/chrome:\/\/flags\/\">chrome:\/\/flags<\/a>). \u042d\u0442\u043e \u0441\u043a\u043e\u0440\u0435\u0435 \u044d\u043a\u0437\u043e\u0442\u0438\u043a\u0430 \u0438 \u043c\u0430\u043b\u043e\u0432\u0435\u0440\u043e\u044f\u0442\u043d\u043e \u043a\u043e\u0433\u0434\u0430 \u043d\u0438\u0431\u0443\u0434\u044c \u043f\u0440\u0438\u0433\u043e\u0434\u0438\u0442\u0441\u044f \u0432 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438, \u043d\u043e \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u0434\u043b\u044f debug-\u043f\u0440\u043e\u0432\u0435\u0440\u043e\u043a \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u043b\u0435\u0437\u043d\u043e.<\/p>\n<\/li>\n<li>\n<p>\u0410 \u0435\u0441\u043b\u0438 \u0445\u043e\u0442\u0438\u0442\u0435 \u043f\u043e\u043b\u044e\u0431\u043e\u043f\u044b\u0442\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c, \u043a\u0430\u043a\u043e\u0439 \u0441\u043a\u0440\u044b\u0442\u044b\u0439 (\u0432 \u0442.\u0447. \u0438 \u0434\u0435\u0431\u0430\u0436\u043d\u044b\u0439) \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b \u0435\u0441\u0442\u044c \u0435\u0449\u0451 \u0443 Google Chrome, \u0442\u043e \u043f\u043e\u043b\u043d\u044b\u0439 \u0441\u043f\u0438\u0441\u043e\u043a \u0441\u0442\u0440\u0430\u043d\u0438\u0446 \u043b\u0435\u0436\u0438\u0442 \u0437\u0434\u0435\u0441\u044c\u00a0<a href=\"https:\/\/chrome:\/\/about\/\">chrome:\/\/about<\/a>.<\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>\u0420\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 \u043f\u043b\u0430\u0433\u0438\u043d\u044b (\u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f) \u0434\u043b\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430:<\/summary>\n<div class=\"spoiler__content\">\n<p><strong>PixelPerfect<\/strong>\u00a0\u2014 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043d\u0430\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0442\u044c \u043f\u043e\u0432\u0435\u0440\u0445 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0441\u043a\u0440\u0438\u043d\u0448\u043e\u0442 \u0438\u0437 \u043c\u0430\u043a\u0435\u0442\u0430, \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u0434\u0438\u0437\u0430\u0439\u043d \u0441 \u0442\u043e\u0447\u043d\u043e\u0441\u0442\u044c\u044e \u0434\u043e \u043f\u0438\u043a\u0441\u0435\u043b\u044f.<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/www.welldonecode.com\/perfectpixel\">WellDoneCode<\/a><\/p>\n<\/li>\n<li>\n<p>\u0421\u0441\u044b\u043b\u043a\u0430 \u0432 \u043c\u0430\u0433\u0430\u0437\u0438\u043d\u0435 Chrome:\u00a0<a href=\"https:\/\/chrome.google.com\/webstore\/detail\/perfectpixel-by-welldonec\/dkaagdgjmgdmbnecmcefdhjekcoceebi?hl=ru\">PerfectPixel by WellDoneCode (pixel perfect)<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/3f9\/0df\/b3d\/3f90dfb3d64ae50e265aa1c6e6d79eae.png\" width=\"907\" height=\"547\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/3f9\/0df\/b3d\/3f90dfb3d64ae50e265aa1c6e6d79eae.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>Dimensions<\/strong>\u00a0\u2014 \u0432\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u043a\u0443\u0440\u0441\u043e\u0440-\u043f\u0435\u0440\u0435\u043a\u0440\u0435\u0441\u0442\u0438\u0435, \u0434\u043b\u044f \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432 \u043c\u0435\u0436\u0434\u0443 HTML \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438.<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/felixniklas.com\/dimensions\">FelixNiklas<\/a><\/p>\n<\/li>\n<li>\n<p>\u0421\u0441\u044b\u043b\u043a\u0430 \u0432 \u043c\u0430\u0433\u0430\u0437\u0438\u043d\u0435 Chrome:\u00a0<a href=\"https:\/\/chrome.google.com\/webstore\/detail\/dimensions\/baocaagndhipibgklemoalmkljaimfdj?hl=ru\">Dimensions<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/f8e\/c62\/af3\/f8ec62af3f73a58fd4c584669c998179.png\" width=\"597\" height=\"303\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/f8e\/c62\/af3\/f8ec62af3f73a58fd4c584669c998179.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>Tab Resize<\/strong>\u00a0\u2014 \u0440\u0430\u0437\u0431\u0438\u0432\u043a\u0430 \u0432\u043a\u043b\u0430\u0434\u043e\u043a \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 \u043d\u0430 \u0434\u0432\u0430 \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u044b\u0445 \u043f\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u0443 \u043e\u043a\u043d\u0430 \u043f\u043e \u043f\u0440\u0438\u043d\u0446\u0438\u043f\u0443 split-screen. \u041c\u043e\u0436\u0435\u0442 \u043f\u0440\u0438\u0433\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0434\u043b\u044f \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u044f \u0434\u0432\u0443\u0445 \u0440\u0430\u0437\u043d\u044b\u0445 \u0432\u0435\u0440\u0441\u0438\u0439 Frontend.<\/p>\n<ul>\n<li>\n<p>GitHub:\u00a0<a href=\"https:\/\/github.com\/peterdotjs\/tab-resize\">Tab Resize<\/a><\/p>\n<\/li>\n<li>\n<p>\u0421\u0441\u044b\u043b\u043a\u0430 \u0432 \u043c\u0430\u0433\u0430\u0437\u0438\u043d\u0435 Chrome:\u00a0<a href=\"https:\/\/chrome.google.com\/webstore\/detail\/tab-resize-split-screen-l\/bkpenclhmiealbebdopglffmfdiilejc?hl=ru\">Tab Resize &#8212; split screen layouts<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/2df\/209\/6b7\/2df2096b76be257e19700ac8509cfe53.png\" width=\"628\" height=\"485\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/2df\/209\/6b7\/2df2096b76be257e19700ac8509cfe53.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>ModHeader<\/strong>\u00a0\u2014 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0438 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432\/\u043e\u0442\u0432\u0435\u0442\u043e\u0432, \u043c\u043e\u0434\u0438\u0444\u0438\u0446\u0438\u0440\u043e\u0432\u0430\u0442\u044c cookie \u0438 \u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0442\u044c \u0440\u0435\u0434\u0438\u0440\u0435\u043a\u0442 \u0441 \u043e\u0434\u043d\u043e\u0433\u043e URL \u043d\u0430 \u0434\u0440\u0443\u0433\u043e\u0439.<\/p>\n<ul>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/docs.modheader.com\/\">Introduction ModHeader<\/a><\/p>\n<\/li>\n<li>\n<p>\u0421\u0441\u044b\u043b\u043a\u0430 \u0432 \u043c\u0430\u0433\u0430\u0437\u0438\u043d\u0435 Chrome:\u00a0<a href=\"https:\/\/chrome.google.com\/webstore\/detail\/modheader\/idgpnmonknjnojddfkpgkljpfnnfcklj\/related?hl=ru\">ModHeader<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/700\/a46\/149\/700a461497f0edaec50e44bc453be009.png\" width=\"1275\" height=\"454\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/700\/a46\/149\/700a461497f0edaec50e44bc453be009.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>Get cookies.txt<\/strong>\u00a0\u2014 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u043e\u0431\u0440\u0430\u043d\u043d\u044b\u0435 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 cookie \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 txt-\u0444\u0430\u0439\u043b.<\/p>\n<ul>\n<li>\n<p>\u0421\u0441\u044b\u043b\u043a\u0430 \u0432 \u043c\u0430\u0433\u0430\u0437\u0438\u043d\u0435 Chrome:\u00a0<a href=\"https:\/\/chrome.google.com\/webstore\/detail\/get-cookiestxt\/bgaddhkoddajcdgocldbbfleckgcbcid?hl=ru\">Get cookies.txt<\/a><\/p>\n<\/li>\n<\/ul>\n<p><strong>Bonus:<\/strong><\/p>\n<p><strong>Screencastify<\/strong>\u00a0\u2014 \u0432\u0441\u043f\u043e\u043c\u043e\u0433\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435, \u0443\u0434\u043e\u0431\u043d\u043e\u0435 \u0434\u043b\u044f \u0437\u0430\u043f\u0438\u0441\u0438 \u0432\u0438\u0434\u0435\u043e \u043a\u0430\u043a \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0435, \u0442\u0430\u043a \u0438 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043d\u0430 \u0432\u0441\u0451\u043c \u044d\u043a\u0440\u0430\u043d\u0435, \u0441 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c\u044e \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u0438\u0434\u0435\u043e \u0432 MP4. \u041f\u0440\u0438\u0433\u043e\u0434\u0438\u0442\u0441\u044f \u0434\u043b\u044f \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u0434\u0435\u0444\u0435\u043a\u0442\u043e\u0432.<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/www.screencastify.com\/\">Screencastify\u00a0<\/a><\/p>\n<\/li>\n<li>\n<p>\u0421\u0441\u044b\u043b\u043a\u0430 \u0432 \u043c\u0430\u0433\u0430\u0437\u0438\u043d\u0435 Chrome:\u00a0<a href=\"https:\/\/chrome.google.com\/webstore\/detail\/screencastify-screen-vide\/mmeijimgabbpbgpdklnllpncmdofkcpn?hl=ru\">Screencastify &#8212; Screen Video Recorder<\/a><\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>\u041f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u044b \u043f\u0435\u0440\u0435\u0445\u0432\u0430\u0442\u0430 \u0438 \u043f\u043e\u0434\u043c\u0435\u043d\u044b \u0442\u0440\u0430\u0444\u0438\u043a\u0430 (\u0441\u043d\u0438\u0444\u0444\u0435\u0440\u044b):<\/summary>\n<div class=\"spoiler__content\">\n<p><strong>Charles Web Debugging Proxy<\/strong>\u00a0\u2014 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \u043c\u043e\u043d\u0438\u0442\u043e\u0440\u0438\u043d\u0433\u0430 HTTP \u0438 HTTPS \u0442\u0440\u0430\u0444\u0438\u043a\u0430. \u041f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u0435\u0440\u0435\u0445\u0432\u0430\u0442\u044b\u0432\u0430\u0442\u044c HTTP-\u0437\u0430\u043f\u0440\u043e\u0441\u044b, \u043f\u043e\u0434\u043c\u0435\u043d\u044f\u0442\u044c \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043a\u0430\u043a \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432, \u0442\u0430\u043a \u0438 \u043e\u0442\u0432\u0435\u0442\u043e\u0432.<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/www.charlesproxy.com\/\">Charles Proxy<\/a><\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/www.charlesproxy.com\/documentation\">Charles Proxy &#8212; Welcome<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/da0\/d6a\/f01\/da0d6af01197075f0219077b799c3f1e.png\" width=\"2620\" height=\"938\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/da0\/d6a\/f01\/da0d6af01197075f0219077b799c3f1e.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>Fiddler<\/strong>\u00a0\u2014 \u043f\u043e \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0438 \u0441 Charles, \u0441\u043d\u0438\u0444\u0444\u0435\u0440 HTTP\/HTTPS \u0442\u0440\u0430\u0444\u0438\u043a\u0430, \u0441 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c\u044e \u043c\u043e\u0434\u0438\u0444\u0438\u0446\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0437\u0430\u043f\u0440\u043e\u0441\u044b \u0438 \u043e\u0442\u0432\u0435\u0442\u044b.<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/www.telerik.com\/fiddler\">Telerik<\/a><\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/docs.telerik.com\/fiddler\/configure-fiddler\/tasks\/configurefiddler\">Getting Started with Fiddler Classic<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/faa\/3cf\/a05\/faa3cfa0527e4ff2c128b9ee3e44609d.png\" width=\"1674\" height=\"1110\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/faa\/3cf\/a05\/faa3cfa0527e4ff2c128b9ee3e44609d.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>Wireshark<\/strong>\u00a0\u2014 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0430 \u0434\u043b\u044f \u0437\u0430\u0445\u0432\u0430\u0442\u0430 \u0438 \u0430\u043d\u0430\u043b\u0438\u0437\u0430 \u0441\u0435\u0442\u0435\u0432\u043e\u0433\u043e \u0442\u0440\u0430\u0444\u0438\u043a\u0430. \u0412 \u043e\u0442\u043b\u0438\u0447\u0438\u0435 \u043e\u0442 Charles \u0438 Fiddler, Wireshark \u0437\u0430\u0445\u0432\u0430\u0442\u044b\u0432\u0430\u0435\u0442 \u0442\u0440\u0430\u0444\u0438\u043a \u043d\u0430 \u0431\u043e\u043b\u0435\u0435 \u043d\u0438\u0437\u043a\u043e\u043c \u0443\u0440\u043e\u0432\u043d\u0435 (\u043d\u0430 \u0443\u0440\u043e\u0432\u043d\u0435 \u0441\u0435\u0442\u0435\u0432\u044b\u0445 \u043f\u0430\u043a\u0435\u0442\u043e\u0432).<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/www.wireshark.org\/\">Wireshark<\/a><\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/www.wireshark.org\/docs\/wsug_html_chunked\">Wireshark User&#8217;s Guide<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/e6c\/222\/4c1\/e6c2224c12f7d9cf8df7caeb4b99b87e.png\" width=\"2390\" height=\"1344\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/e6c\/222\/4c1\/e6c2224c12f7d9cf8df7caeb4b99b87e.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>\u0414\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 Web API:<\/summary>\n<div class=\"spoiler__content\">\n<p><strong>Postman<\/strong>\u00a0\u2014 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \u0434\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 Web API, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0437\u0430\u043f\u0440\u043e\u0441\u044b \u0438 \u043f\u043e\u043b\u0443\u0447\u0430\u0442\u044c \u043e\u0442\u0432\u0435\u0442\u044b \u0431\u0435\u0437 \u0443\u0447\u0430\u0441\u0442\u0438\u044f Frontend \u0447\u0430\u0441\u0442\u0438 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/www.postman.com\/\">Postman<\/a><\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/learning.postman.com\/docs\/getting-started\/introduction\">Postman Introduction<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/d01\/87d\/2a0\/d0187d2a02dda7799e76b5b0cbbd7ce1.png\" width=\"2390\" height=\"1190\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d01\/87d\/2a0\/d0187d2a02dda7799e76b5b0cbbd7ce1.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>Swagger UI<\/strong>\u00a0\u2014 \u043c\u043e\u0449\u043d\u044b\u0439 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \u0434\u043b\u044f \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0439 RESTful API, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0449\u0438\u0439 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0441 \u044d\u0442\u0438\u043c API \u0447\u0435\u0440\u0435\u0437 web-\u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441. \u0415\u0433\u043e \u043d\u0435\u043b\u044c\u0437\u044f \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u043a\u0430\u043a stand-alone \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435 \u0440\u0430\u0437\u0432\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432\u043e \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0435\u0439 \u0438\u043d\u0444\u0440\u0430\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0435.<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/swagger.io\/\">Swagger<\/a><\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/swagger.io\/tools\/swagger-ui\">REST API Documentation Tool<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/d27\/de0\/b35\/d27de0b35c15b696ce6163c6419941ad.png\" width=\"2792\" height=\"776\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d27\/de0\/b35\/d27de0b35c15b696ce6163c6419941ad.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>\u0414\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u0411\u0414:<\/summary>\n<div class=\"spoiler__content\">\n<p><strong>MySQL Workbench<\/strong>\u00a0\u2014 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \u0434\u043b\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 MySQL \u0431\u0430\u0437\u0430\u043c\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 (\u0441\u0445\u0435\u043c\u0430\u043c\u0438, \u0442\u0430\u0431\u043b\u0438\u0446\u0430\u043c\u0438, \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u044b\u043c, \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u043e\u0439 SQL-\u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432 \u0438 \u043f\u0440.).<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/www.mysql.com\/products\/workbench\">MySQL<\/a><\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/dev.mysql.com\/doc\/workbench\/en\">MySQL Workbench Manual<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/b84\/339\/5ce\/b843395ce94d2eb9247dc46f5fcdae27.png\" width=\"2000\" height=\"1174\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/b84\/339\/5ce\/b843395ce94d2eb9247dc46f5fcdae27.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>Datagrip<\/strong>\u00a0\u2014 \u0441\u0440\u0435\u0434\u0430 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0434\u043b\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u043c\u0438 SQL \u0438 No-SQL \u0431\u0430\u0437\u0430\u043c\u0438 \u0434\u0430\u043d\u043d\u044b\u0445 (PostgreSQL, MySQL, MS SQL, Mongo DB \u0438 \u0442.\u0434.).<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/www.jetbrains.com\/datagrip\">JetBrains<\/a><\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/www.jetbrains.com\/help\/datagrip\/meet-the-product.html\">Datagrip Introduction<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/1d6\/3af\/c3f\/1d63afc3f31a35a19394bf3dedc56f3d.png\" width=\"1522\" height=\"1516\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/1d6\/3af\/c3f\/1d63afc3f31a35a19394bf3dedc56f3d.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>\u042d\u043c\u0443\u043b\u044f\u0446\u0438\u044f \u0441\u0435\u0442\u0435\u0432\u043e\u0433\u043e \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f:<\/summary>\n<div class=\"spoiler__content\">\n<p><strong>Network Emulator for Windows Toolkit<\/strong>\u00a0&#8212; \u041f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u044d\u043c\u0443\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u043b\u043e\u0445\u043e\u0435 \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u0435, \u043f\u043e\u0442\u0435\u0440\u0438 \u0441\u0435\u0442\u0435\u0432\u044b\u0445 \u043f\u0430\u043a\u0435\u0442\u043e\u0432, \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c, \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f Windows\u00a0<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/www.microsoft.com\/en-us\/research\/lab\/microsoft-research-asia\">Microsoft Research Asia<\/a><\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f: ?<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/c4f\/dd5\/9c2\/c4fdd59c24c07c9d151d872195212667.png\" width=\"806\" height=\"358\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/c4f\/dd5\/9c2\/c4fdd59c24c07c9d151d872195212667.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>Clumsy<\/strong>\u00a0\u2014 \u044d\u043c\u0443\u043b\u044f\u0442\u043e\u0440 \u0441\u0435\u0442\u0435\u0432\u043e\u0433\u043e \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f, \u043e\u0431\u043b\u0430\u0434\u0430\u0435\u0442 \u0442\u0430\u043a\u0438\u043c \u0436\u0435 \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u0438\u043c \u043d\u0430\u0431\u043e\u0440\u043e\u043c \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a: \u0432\u0445\u043e\u0434\u044f\u0449\u0430\u044f\/\u0438\u0441\u0445\u043e\u0434\u044f\u0449\u0430\u044f \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u044f, \u043f\u043e\u0442\u0435\u0440\u0438 \u043f\u0430\u043a\u0435\u0442\u043e\u0432 \u0438 \u0442.\u0434.<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/jagt.github.io\/clumsy\">GitHub Clumsy<\/a><\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/jagt.github.io\/clumsy\/manual.html\">Clumsy Manual<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/41f\/924\/f78\/41f924f78082450fa6b4c8a55a6d57d2.png\" width=\"2388\" height=\"1136\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/41f\/924\/f78\/41f924f78082450fa6b4c8a55a6d57d2.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>Network Link Conditioner<\/strong>\u00a0\u2014 \u0431\u043e\u043b\u0435\u0435 \u0441\u043a\u0443\u0434\u043d\u044b\u0439 \u043f\u043e \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u044e \u0441 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u0432\u044b\u0448\u0435, \u0432 \u0441\u0432\u043e\u0435\u0439 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0435 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0437\u0430\u0434\u0430\u0432\u0430\u0442\u044c \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c, \u043f\u043e\u0442\u0435\u0440\u044e \u043f\u0430\u043a\u0435\u0442\u043e\u0432 \u0438 \u0437\u0430\u0434\u0435\u0440\u0436\u043a\u0443 \u0434\u043b\u044f \u0432\u0445\u043e\u0434\u044f\u0449\u0435\u0433\u043e\/\u0438\u0441\u0445\u043e\u0434\u044f\u0449\u0435\u0433\u043e \u0442\u0440\u0430\u0444\u0438\u043a\u0430. \u0414\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f macOS. \u0414\u043b\u044f \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438 \u043f\u043e\u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0441\u043a\u0430\u0447\u0430\u0442\u044c Additional Tools for XCode.<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/developer.apple.com\/\">Apple for Developers<\/a><\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f: ?<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/2e9\/9fc\/0e2\/2e99fc0e28e865f27554e59a477784cf.png\" width=\"1544\" height=\"694\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/2e9\/9fc\/0e2\/2e99fc0e28e865f27554e59a477784cf.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>\u0414\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u043c\u0438 \u0444\u0430\u0439\u043b\u0430\u043c\u0438, \u043b\u043e\u0433\u0430\u043c\u0438, \u043a\u043e\u0434\u043e\u043c:<\/summary>\n<div class=\"spoiler__content\">\n<p><strong>Visual Studio Code<\/strong>\u00a0\u2014 \u00ab\u043b\u0451\u0433\u043a\u0438\u0439\u00bb \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440 \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u0433\u043e \u043a\u043e\u0434\u0430 \u0434\u043b\u044f \u043a\u0440\u043e\u0441\u043f\u043b\u0430\u0442\u0444\u043e\u0440\u043c\u0435\u043d\u043d\u043e\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438.<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/code.visualstudio.com\/\">Visual Studio Code<\/a><\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/code.visualstudio.com\/docs\">VS Code Getting Started<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/976\/756\/845\/9767568456e3b7428067a231f7f392ce.png\" width=\"1436\" height=\"714\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/976\/756\/845\/9767568456e3b7428067a231f7f392ce.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>Sublime Text<\/strong>\u00a0\u2014 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0439 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440, \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u044f\u0435\u043c\u044b\u0439 \u043f\u043e \u043c\u043e\u0434\u0435\u043b\u0438 share-ware.<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/www.sublimetext.com\/\">Sublime Text<\/a><\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/www.sublimetext.com\/docs\">Sublime Text Documentation<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/26d\/27e\/79a\/26d27e79aa9e0b9dafa05b9f1c18ff28.png\" width=\"1274\" height=\"290\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/26d\/27e\/79a\/26d27e79aa9e0b9dafa05b9f1c18ff28.png\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>Atom<\/strong>\u00a0\u2014 \u0431\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u044b\u0439 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0439 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440 \u0441 \u043e\u0442\u043a\u0440\u044b\u0442\u044b\u043c \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u043c \u043a\u043e\u0434\u043e\u043c.<\/p>\n<ul>\n<li>\n<p>\u0421\u0430\u0439\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430:\u00a0<a href=\"https:\/\/atom.io\/\">Atom<\/a><\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f:\u00a0<a href=\"https:\/\/atom.io\/docs\">Atom Documentation<\/a><\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/d49\/64d\/e34\/d4964de34d8fae3d63622c6f89b57289.png\" width=\"1856\" height=\"766\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d49\/64d\/e34\/d4964de34d8fae3d63622c6f89b57289.png\"\/><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>\u041a\u043e\u043d\u0441\u043e\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043c\u0430\u043d\u0434\u044b \u0438 \u0443\u0442\u0438\u043b\u0438\u0442\u044b:<\/summary>\n<div class=\"spoiler__content\">\n<p><strong>\u0414\u043b\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430<\/strong><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<th>\n<p>\u041a\u043e\u043c\u0430\u043d\u0434\u0430<\/p>\n<\/th>\n<th>\n<p>\u041e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435<\/p>\n<\/th>\n<th>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f<\/p>\n<\/th>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>head\/body<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>\u0417\u0430\u043f\u0440\u043e\u0441\u0438\u0442\u044c HTML \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a \u0438\u043b\u0438 \u0442\u0435\u043b\u043e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>document.head<\/code><\/p>\n<p align=\"left\"><code>document.body<\/code><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>forms<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>\u0412\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u0441\u043f\u0438\u0441\u043e\u043a \u0432\u0441\u0435\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u043d\u0430\u0445\u043e\u0434\u044f\u0449\u0438\u0445\u0441\u044f \u0432 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0435<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>document.forms<\/code><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>location<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>\u0412\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043c\u0435\u0441\u0442\u043e\u043d\u0430\u0445\u043e\u0436\u0434\u0435\u043d\u0438\u0435 (\u0430\u0434\u0440\u0435\u0441) \u0442\u0435\u043a\u0443\u0449\u0435\u0439 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>window.location<\/code><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>cookie<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>\u0417\u0430\u043f\u0440\u0430\u0448\u0438\u0432\u0430\u0435\u0442 cookie \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>document.cookie<\/code><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>lastModified<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>\u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u043a\u043e\u0433\u0434\u0430 \u0431\u044b\u043b\u0438 \u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u044b \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0438\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>document.lastModified<\/code><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>dataLayer<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>\u0421\u043b\u043e\u0439 (\u0443\u0440\u043e\u0432\u0435\u043d\u044c) \u0434\u0430\u043d\u043d\u044b\u0445, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u044e\u0442\u0441\u044f \u0432 Google Tag Manager.<\/code><\/p>\n<p align=\"left\"><code>\u041d\u0435 \u043d\u0430 \u0432\u0441\u0435\u0445 \u0441\u0430\u0439\u0442\u0430\u0445 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0437\u0430\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u043d<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>window.dataLayer<\/code><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>contentEditable<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>\u0420\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u043b\u044e\u0431\u043e\u0433\u043e \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>document.body.contentEditable = true<\/code><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f \u043f\u043e \u0440\u0430\u0437\u043d\u044b\u043c API \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432, \u0433\u0434\u0435 \u043c\u043e\u0436\u043d\u043e \u043e\u0437\u043d\u0430\u043a\u043e\u043c\u0438\u0442\u044c\u0441\u044f \u0441\u043e \u0432\u0441\u0435\u043c \u043f\u0435\u0440\u0435\u0447\u043d\u0435\u043c \u043a\u043e\u043c\u0430\u043d\u0434:<\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/developer.chrome.com\/docs\/extensions\/reference\">Chrome API Reference<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\">Mozilla Web APIs<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/developer.apple.com\/documentation\/webkitjs\">Safari WebKit JS<\/a><\/p>\n<\/li>\n<\/ul>\n<p><strong>\u0414\u043b\u044f<\/strong> <strong>\u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b\u0430 \u0438\u043b\u0438 \u043a\u043e\u043c\u0430\u043d\u0434\u043d\u043e\u0439 \u0441\u0442\u0440\u043e\u043a\u0438<\/strong>\u00a0(Terminal, CLI \u2014 &#171;Command Line Interface&#187;)<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<th>\n<p>\u041a\u043e\u043c\u0430\u043d\u0434\u0430\/\u0423\u0442\u0438\u043b\u0438\u0442\u0430<\/p>\n<\/th>\n<th>\n<p>\u041e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435<\/p>\n<\/th>\n<th>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f<\/p>\n<\/th>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>ping<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>\u041f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u0442 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e\u0441\u0442\u044c \u0443\u0437\u043b\u0430, \u043f\u043e\u0441\u044b\u043b\u0430\u044f \u043a \u043d\u0435\u043c\u0443 ICMP-\u0437\u0430\u043f\u0440\u043e\u0441\u044b<\/code><\/p>\n<p align=\"left\"><code>ping Windows Documentation<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>ping\u00a0google.com<\/code><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>tracert\/traceroute<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>\u0422\u0440\u0430\u0441\u0441\u0438\u0440\u0443\u0435\u0442\u00a0 \u0441\u0435\u0442\u0435\u0432\u043e\u0439 \u043c\u0430\u0440\u0448\u0440\u0443\u0442 \u0434\u043e \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u043e\u0433\u043e \u0443\u0437\u043b\u0430.<\/code><\/p>\n<p align=\"left\"><code>\u0412 Windows \u0443\u0442\u0438\u043b\u0438\u0442\u0430 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043a\u043e\u043c\u0430\u043d\u0434\u043e\u0439 tracert, \u0432 unix - traceroute<\/code><\/p>\n<p align=\"left\"><code>tracert Windows Documentation<\/code><\/p>\n<p align=\"left\"><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>traceroute\u00a0google.com<\/code><\/p>\n<p align=\"left\"><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>curl<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>\u041a\u043e\u043d\u0441\u043e\u043b\u044c\u043d\u0430\u044f \u0443\u0442\u0438\u043b\u0438\u0442\u0430 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0449\u0430\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c web-\u0441\u0435\u0440\u0432\u0435\u0440\u0430\u043c\u0438 \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e \u0447\u0435\u0440\u0435\u0437 URL<\/code><\/p>\n<p align=\"left\"><code>cURL Tool Documentation<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>curl\u00a0google.com<\/code><\/p>\n<p align=\"left\"><code>curl -I\u00a0https:\/\/www.google.com<\/code><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>wget<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>\u041f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u043a\u0430\u0447\u0438\u0432\u0430\u0442\u044c \u0444\u0430\u0439\u043b\u044b \u043f\u043e \u0441\u0435\u0442\u0438<\/code><\/p>\n<p align=\"left\"><code>GNU Wget Manual<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>wget\u00a0https:\/\/www.google.com\/doodles\/static\/sprites\/sprites_v4.png<\/code><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>httpdiff<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>\u0423\u0442\u0438\u043b\u0438\u0442\u0430, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0449\u0430\u044f \u0441\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u0442\u044c \u0434\u0432\u0430 \u0440\u0430\u0437\u043d\u044b\u0445 HTTP \u0437\u0430\u043f\u0440\u043e\u0441\u0430<\/code><\/p>\n<p align=\"left\"><code>GitHub httpdiff<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>httpdiff\u00a0https:\/\/www.google.co.uk\u00a0https:\/\/www.google.com<\/code><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>httppie<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>\u041a\u043e\u043d\u0441\u043e\u043b\u044c\u043d\u044b\u0439 HTTP \u043a\u043b\u0438\u0435\u043d\u0442<\/code><\/p>\n<p align=\"left\"><code>HTTPie Documentation<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>http GET\u00a0https:\/\/www.google.com<\/code><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>siege<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>\u0423\u0442\u0438\u043b\u0438\u0442\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u043d\u0430\u0433\u0440\u0443\u0437\u043e\u0447\u043d\u043e\u0433\u043e \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f, \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 HTTP-\u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432<\/code><\/p>\n<p align=\"left\"><code>GitHub siege<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>siege -b -v -c 30 -r 500\u00a0https:\/\/www.google.com<\/code><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n<\/details>\n<hr\/>\n<p>\u041f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0441\u0441\u044b\u043b\u043a\u0438 \u0438 \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u0438:<\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/www.uxmatters.com\/mt\/archives\/2011\/03\/10-ways-mobile-sites-are-different-from-desktop-web-sites.php\">10 Ways Mobile Sites Are Different from Desktop Web Sites<\/a>\u00a0(UX) (2011 \u0433.)<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/www.html5rocks.com\/ru\/tutorials\/internals\/howbrowserswork\/\">\u041f\u0440\u0438\u043d\u0446\u0438\u043f\u044b \u0440\u0430\u0431\u043e\u0442\u044b \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u0432\u0435\u0431-\u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432<\/a>\u00a0(2011 \u0433.)<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/habr.com\/ru\/company\/htmlacademy\/blog\/254825\/\">\u0427\u0442\u043e \u043d\u0430 \u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442, \u043a\u043e\u0433\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0432\u0431\u0438\u0432\u0430\u0435\u0442 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0430\u0434\u0440\u0435\u0441\u00a0<\/a><a href=\"https:\/\/google.com\/\">google.com<\/a>\u00a0(2015 \u0433.)<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/habr.com\/ru\/post\/541180\/\">\u0411\u0440\u0430\u0443\u0437\u0435\u0440\u043d\u044b\u0435 \u0432\u043e\u0439\u043d\u044b 2021<\/a>\u00a0(2021 \u0433.)<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/semantic-ui.com\/\">Semantic UI<\/a>\u00a0(2.4.2) (2018 \u0433.)<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/borodaboroda.com\/blog\/elementy-interfejsa-sajta\">\u042d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 \u0441\u0430\u0439\u0442\u0430<\/a>\u00a0(\u0411\u043b\u043e\u0433 Boroda Digital) (2020 \u0433.)<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\">Developer Mozilla Web Docs<\/a>\u00a0(2022 \u0433.)<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/www.w3schools.com\/default.asp\">W3Schools<\/a>\u00a0(2022 \u0433.)<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/support.google.com\/chrome\/answer\/95669?hl=ru&amp;co=GENIE.Platform%3DAndroid#zippy=%2C%D0%BA%D0%BE%D0%B4%D1%8B-%D0%BE%D1%88%D0%B8%D0%B1%D0%BE%D0%BA-%D0%B2%D0%BE%D0%B7%D0%BD%D0%B8%D0%BA%D0%B0%D1%8E%D1%89%D0%B8%D1%85-%D0%BF%D1%80%D0%B8-%D0%B7%D0%B0%D0%B3%D1%80%D1%83%D0%B7%D0%BA%D0%B5-%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86%D1%8B\">\u041a\u0430\u043a \u0443\u0441\u0442\u0440\u0430\u043d\u0438\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0438, \u0432\u043e\u0437\u043d\u0438\u043a\u0430\u044e\u0449\u0438\u0435 \u043f\u0440\u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/a>\u00a0(Google Support) (2022 \u0433.)<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/developer.chrome.com\/docs\/devtools\/\">Chrome DevTools<\/a>\u00a0(Google Documentation) (2022 \u0433.)<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/webformyself.com\/varianty-xraneniya-dannyx-v-brauzere-v-2021-godu\/\">\u0412\u0430\u0440\u0438\u0430\u043d\u0442\u044b \u0445\u0440\u0430\u043d\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u044b\u0445 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435 \u0432 2021 \u0433\u043e\u0434\u0443<\/a>\u00a0(2021 \u0433.)<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/developer.chrome.com\/blog\/inside-browser-part1\">Inside look at modern web browser (part 1)<\/a>\u00a0(Google) (2018 \u0433.)<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/www.debugbear.com\/blog\/devtools-performance\">Profiling site speed with the Chrome DevTools Performance tab<\/a>\u00a0(2021 \u0433.)<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/ru.wikipedia.org\/\">Wikipedia<\/a>\u00a0(2022 \u0433.)<\/p>\n<\/li>\n<li>\n<p>\u0418 \u0432\u0441\u044f\u043a\u043e-\u0440\u0430\u0437\u043d\u044b\u0435 \u043a\u0430\u0440\u0442\u0438\u043d\u043e\u0447\u043a\u0438 \u0438 \u043f\u0440\u043e\u0447\u0430\u044f \u0440\u0430\u043d\u0434\u043e\u043c\u043d\u0430\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043e\u0442\u043a\u0440\u044b\u0442\u043e \u0445\u0440\u0430\u043d\u0438\u0442\u0441\u044f \u043d\u0430 \u043f\u0440\u043e\u0441\u0442\u043e\u0440\u0430\u0445 \u044d\u0442\u0438\u0445 \u0432\u0430\u0448\u0438\u0445 \u0438\u043d\u0442\u0435\u0440\u043d\u0435\u0442\u043e\u0432<\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"v-portal\" style=\"display:none;\"><\/div>\n<\/div>\n<p> <!----> <!----><br \/> \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 <a href=\"https:\/\/habr.com\/ru\/company\/space307\/blog\/668974\/\"> https:\/\/habr.com\/ru\/company\/space307\/blog\/668974\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<div><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<div class=\"persona\" persona=\"true\">\n<h5 class=\"persona__heading\" persona=\"true\">\u0410\u043d\u0430\u0442\u043e\u043b\u0438\u0439 \u0420\u044b\u0436\u0430\u043a\u043e\u0432<\/h5>\n<p>QA Engineer \u0432 Space307<\/p>\n<\/div>\n<p>\u0421\u0430\u043b\u044e\u0442, \u0425\u0430\u0431\u0440!<\/p>\n<p>\u041c\u0435\u043d\u044f \u0437\u043e\u0432\u0443\u0442 \u0410\u043d\u0430\u0442\u043e\u043b\u0438\u0439, \u0438 \u044f \u0440\u0430\u0431\u043e\u0442\u0430\u044e \u0432 \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u0438 <a href=\"https:\/\/space307.com\/\">Space307<\/a> \u0432 \u0434\u043e\u043b\u0436\u043d\u043e\u0441\u0442\u0438 QA-\u0438\u043d\u0436\u0435\u043d\u0435\u0440.<\/p>\n<p>\u0414\u043e\u043b\u0433\u0438\u043c \u0438 \u0443\u043f\u043e\u0440\u043d\u044b\u043c \u0442\u0440\u0443\u0434\u043e\u043c \u044f \u0438\u0441\u043a\u0430\u043b \u0438 \u0441\u043e\u0431\u0438\u0440\u0430\u043b \u0432\u043e\u0435\u0434\u0438\u043d\u043e, \u043d\u0430 \u043c\u043e\u0439 \u0432\u0437\u0433\u043b\u044f\u0434, \u0441\u0430\u043c\u0443\u044e \u043f\u043e\u043b\u0435\u0437\u043d\u0443\u044e \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u043e\u043c\u043e\u0436\u0435\u0442 \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c\u0441\u044f \u0432 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0435 Web-\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f.<\/p>\n<p>\u0412\u0441\u0451 \u044d\u0442\u043e \u043f\u043e \u0438\u0442\u043e\u0433\u0443 \u0440\u0430\u0437\u0440\u043e\u0441\u043b\u043e\u0441\u044c \u0438 \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043b\u043e\u0441\u044c \u0432 \u043d\u0435\u043a\u0438\u0439 \u0433\u0430\u0439\u0434, \u0445\u043e\u0442\u044f \u043f\u043e \u0437\u0430\u0434\u0443\u043c\u043a\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0431\u044b\u0442\u044c \u043a\u0440\u0430\u0442\u0435\u043d\u044c\u043a\u0438\u043c \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u043e\u043c \u0434\u043b\u044f \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0435\u0433\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f.<\/p>\n<p>\u041e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u0435 \u0441\u043f\u0430\u0441\u0438\u0431\u043e \u0445\u043e\u0447\u0443 \u0432\u044b\u0440\u0430\u0437\u0438\u0442\u044c \u043a\u043e\u043b\u043b\u0435\u0433\u0430\u043c, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u043c\u043e\u0433\u0430\u043b\u0438 \u0432 \u0441\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0438, \u0434\u043e\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0438 \u0438 \u0440\u0435\u0432\u044c\u044e \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0438. Simply the best!<\/p>\n<p>\u041f\u0435\u0440\u0435\u0434 \u043f\u0440\u043e\u0447\u0442\u0435\u043d\u0438\u0435\u043c: \u043d\u0438\u0447\u0442\u043e \u0432 \u044d\u0442\u043e\u043c \u043c\u0438\u0440\u0435 \u043d\u0435 \u0438\u0434\u0435\u0430\u043b\u044c\u043d\u043e, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043e \u043a\u0430\u043a\u0438\u0445-\u043b\u0438\u0431\u043e \u0437\u0430\u043c\u0435\u0447\u0430\u043d\u0438\u044f\u0445, \u0434\u043e\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f\u0445, \u0443\u0442\u043e\u0447\u043d\u0435\u043d\u0438\u044f\u0445 \u0438 \u043d\u0435\u0434\u043e\u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f\u0445 \u043f\u0438\u0448\u0438\u0442\u0435 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e, \u043d\u043e \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e \u0438 \u0432 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u0438\u0432\u043d\u043e\u0439 \u043c\u0430\u043d\u0435\u0440\u0435, \u043f\u043e\u0436\u0430\u043b\u0443\u0439\u0441\u0442\u0430 \ud83d\ude42<\/p>\n<p>\u0412\u0441\u044e \u043f\u043e\u043b\u0435\u0437\u043d\u043e\u0441\u0442\u044c \u0438\u0437 \u0444\u0438\u0434\u0431\u044d\u043a\u0430 \u043f\u0435\u0440\u0435\u0440\u0430\u0431\u043e\u0442\u0430\u044e \u0434\u043b\u044f \u043f\u0440\u043e\u043a\u0430\u0447\u043a\u0438 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0438.<\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<th data-colwidth=\"193\" width=\"193\">\n<p>\u0426\u0435\u043b\u0435\u0432\u0430\u044f \u0430\u0443\u0434\u0438\u0442\u043e\u0440\u0438\u044f<\/p>\n<\/th>\n<td>\n<p align=\"left\">&#8212; Junior QA Engineer;<br \/>&#8212; \u041a\u0442\u043e \u043d\u0435 \u0437\u043d\u0430\u043a\u043e\u043c \u0441 Web&#8217;\u043e\u043c, \u043d\u043e \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u0443\u0435\u0442\u0441\u044f;<br \/>&#8212; \u041a\u0442\u043e \u0445\u043e\u0447\u0435\u0442 \u043e\u0441\u0432\u0435\u0436\u0438\u0442\u044c \u0437\u043d\u0430\u043d\u0438\u044f \u043e Web&#8217;\u0435.<\/p>\n<\/td>\n<\/tr>\n<tr>\n<th data-colwidth=\"193\" width=\"193\">\n<p>\u0426\u0435\u043b\u044c<\/p>\n<\/th>\n<td>\n<p align=\"left\">\u0421\u043e\u0431\u0440\u0430\u0442\u044c \u043c\u0430\u043a\u0441\u0438\u043c\u0443\u043c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u043e Web, \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0435\u0451 \u0432 \u0435\u0434\u0438\u043d\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u0434\u043b\u044f QA:<\/p>\n<p align=\"left\">&#8212; \u0417\u0434\u0435\u0441\u044c \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u0438\u043c\u0435\u0440\u043e\u0432 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0445 \u0442\u0435\u0441\u0442-\u043a\u0435\u0439\u0441\u043e\u0432<br \/>&#8212; \u0417\u0434\u0435\u0441\u044c \u0431\u0443\u0434\u0435\u0442 \u043e\u0431\u0449\u0435\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043e \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0435 Web&#8217;\u0430<br \/>&#8212; \u041d\u0430 \u0447\u0442\u043e \u043e\u0431\u0440\u0430\u0449\u0430\u0442\u044c \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043f\u0440\u0438 \u043f\u043e\u0434\u0433\u043e\u0442\u043e\u0432\u043a\u0435 \u043a \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044e Web&#8217;\u0430<br \/>&#8212; \u041d\u0435\u043a\u0430\u044f \u0443\u0441\u0440\u0435\u0434\u043d\u0451\u043d\u043d\u0430\u044f \u043c\u043e\u0434\u0435\u043b\u044c (\u0438\u0437 \u0447\u0435\u0433\u043e \u0441\u043e\u0441\u0442\u043e\u0438\u0442 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435)<br \/>&#8212; \u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u043c\u043e\u0433\u0443\u0442 \u0432 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438 Web&#8217;\u0430<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p><strong>Fast Travel:<\/strong><\/p>\n<ul>\n<li>\n<p><a href=\"#ustroistvo\">\u041a\u043b\u0430\u0441\u0441: \u0423\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#brauzer\">\u041a\u043b\u0430\u0441\u0441: \u0411\u0440\u0430\u0443\u0437\u0435\u0440 (\u041e\u0431\u043e\u0437\u0440\u0435\u0432\u0430\u0442\u0435\u043b\u044c)<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#verstka\">\u041a\u043b\u0430\u0441\u0441: \u0412\u0451\u0440\u0441\u0442\u043a\u0430<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#vvod\">\u041a\u043b\u0430\u0441\u0441: \u0412\u0432\u043e\u0434 (\u0423\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435)<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#nastrojka\">\u041a\u043b\u0430\u0441\u0441: \u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 (\u041f\u041e \u0434\u043b\u044f \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430)<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#dannye\">\u041a\u043b\u0430\u0441\u0441: \u0414\u0430\u043d\u043d\u044b\u0435<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#tehnologii\">\u041a\u043b\u0430\u0441\u0441: \u0422\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0438<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#nagruzka\">\u041a\u043b\u0430\u0441\u0441: \u041d\u0430\u0433\u0440\u0443\u0437\u043a\u0430<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#instrumenty\">\u041a\u043b\u0430\u0441\u0441: \u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b<\/a><\/p>\n<\/li>\n<\/ul>\n<h3>Web-\u043e\u0440\u0438\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 (+ \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439)<\/h3>\n<p><a class=\"anchor\" name=\"ustroistvo\" id=\"ustroistvo\"><\/a><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td data-colwidth=\"253\" width=\"253\">\n<p align=\"left\"><strong>\u041e\u0431\u043b\u0430\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"253\" width=\"253\">\n<p align=\"left\"><strong>\u041a\u043b\u0430\u0441\u0441<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0423\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"253\" width=\"253\">\n<p align=\"left\"><strong>\u041e\u0431\u044a\u0435\u043a\u0442\u044b<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212; Desktop (\u0441\u0442\u0430\u0446\u0438\u043e\u043d\u0430\u0440\u043d\u044b\u0439 \u041f\u041a, \u043d\u043e\u0443\u0442\u0431\u0443\u043a)<br \/>&#8212; Mobile (\u0441\u043c\u0430\u0440\u0442\u0444\u043e\u043d, \u043f\u043b\u0430\u043d\u0448\u0435\u0442)<br \/>&#8212; Other (SmartTV, \u0438\u0433\u0440\u043e\u0432\u0430\u044f \u043a\u043e\u043d\u0441\u043e\u043b\u044c)<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<ul>\n<li>\n<p>\u0423\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e \u2014 \u044d\u0442\u043e \u043d\u0435\u043a\u0430\u044f \u00ab\u0431\u0430\u0437\u0430\u00bb,\u00a0\u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442\u044c \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 Web&#8217;\u043e\u043c, \u0442\u043e, \u043a\u0430\u043a\u0438\u043c\u0438 \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043a\u0430\u043c\u0438 \u043e\u0431\u043b\u0430\u0434\u0430\u0435\u0442 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e, \u043a\u0430\u043a\u0438\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u044b \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u043d\u0430 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0435, \u043a\u0430\u043a\u0438\u0435 \u0441\u043f\u043e\u0441\u043e\u0431\u044b \u0432\u0432\u043e\u0434\u0430\/\u0432\u044b\u0432\u043e\u0434\u0430 \u0442\u0430\u043a \u0438\u043b\u0438 \u0438\u043d\u0430\u0447\u0435 \u0432\u043b\u0438\u044f\u044e\u0442 \u043d\u0430 \u044d\u0442\u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435.<\/p>\n<\/li>\n<li>\n<p>\u0412 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f, \u043a\u0430\u043a\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e Web&#8217;\u0430 \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0442\u044c: Desktop \u0438\u043b\u0438 Mobile.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 Web-\u0441\u0430\u0439\u0442\u044b (Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f) \u043d\u0435 \u0438\u043c\u0435\u044e\u0442 Mobile \u0432\u0435\u0440\u0441\u0438\u0439.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u0445 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430\u0445 \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u0442\u044c\u0441\u044f \u043d\u0430 \u043e\u0431\u044b\u0447\u043d\u0443\u044e (desktop) \u0432\u0435\u0440\u0441\u0438\u044e Web&#8217;\u0430.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043d\u0430 Desktop \u0432\u0435\u0440\u0441\u0438\u044e \u0432 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u043c \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435 Google Chrome:<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u041f\u0435\u0440\u0435\u0439\u0442\u0438 \u043d\u0430 Web-\u0441\u0430\u0439\u0442<\/p>\n<\/li>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c \u043c\u0435\u043d\u044e \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0433\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430<\/p>\n<\/li>\n<li>\n<p>\u0412\u044b\u0431\u0440\u0430\u0442\u044c \u043e\u043f\u0446\u0438\u044e \u00ab\u0412\u0435\u0440\u0441\u0438\u044f \u0434\u043b\u044f \u041f\u041a\u00bb (&#171;Desktop site&#187;)<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u041d\u0430 \u041f\u041a \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u044d\u043c\u0443\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u0443\u044e \u0432\u0435\u0440\u0441\u0438\u044e Web&#8217;\u0430.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430 Google Chrome (\u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e DevTools):<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c DevTools \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 (F12 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e)<\/p>\n<\/li>\n<li>\n<p>\u0412\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043f\u0430\u043d\u0435\u043b\u044c \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430 (&#171;Toggle Device Toolbar&#187;)<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u0412 \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0435\u043c \u0441\u043f\u0438\u0441\u043a\u0435 &#171;Dimensions&#187; \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u044d\u043c\u0443\u043b\u0438\u0440\u0443\u0435\u043c\u043e\u0435 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0435 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0440\u0430\u0437\u043b\u0438\u0447\u0438\u044f \u043c\u0435\u0436\u0434\u0443 Mobile Web \u0438 Desktop Web: \u043e\u0440\u0433\u0430\u043d\u044b \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u0439 (\u043a\u0443\u0440\u0441\u043e\u0440 \u0438\u043b\u0438 \u0442\u0430\u043f), \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0437\u0430\u0446\u0438\u044f \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430, \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044f \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 (\u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u0430\u044f \u0438\u043b\u0438 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u0430\u044f), \u043d\u0430\u0431\u043e\u0440 \u0438 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 UI \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 (\u0432 \u0442.\u0447. \u0438 \u0442\u0435\u043a\u0441\u0442), \u0438\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u044f \u0441 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u043e\u043c \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 GPS).<\/p>\n<\/li>\n<li>\n<p>\u0415\u0449\u0451 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0442\u0430\u043a\u043e\u0435 \u043f\u043e\u043d\u044f\u0442\u0438\u0435 \u043a\u0430\u043a PWA (&#171;<strong>Progressive Web Application<\/strong>&#171;) \u0432\u0435\u0440\u0441\u0438\u044f Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b (\u0438\u043b\u0438 Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f), \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u043e \u0441\u0432\u043e\u0435\u0439 \u0441\u0443\u0442\u0438 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u0443\u044e \u0438 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u0443\u044e \u00ab\u0442\u0440\u0430\u043d\u0441\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e\u00bb \u0432 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0441 \u043f\u043e\u043c\u0435\u0449\u0435\u043d\u0438\u0435\u043c \u0438\u043a\u043e\u043d\u043a\u0438 \u043d\u0430 \u0434\u043e\u043c\u0430\u0448\u043d\u0438\u0439 \u044d\u043a\u0440\u0430\u043d\/\u0440\u0430\u0431\u043e\u0447\u0438\u0439 \u0441\u0442\u043e\u043b \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u043a \u043d\u0435\u043c\u0443.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>PWA \u043d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 Google Maps:<\/summary>\n<div class=\"spoiler__content\">\n<p>\u0427\u0442\u043e\u0431\u044b \u0443\u0437\u043d\u0430\u0442\u044c, \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u043b\u0438 Web-\u0441\u0430\u0439\u0442 PWA \u0432\u0435\u0440\u0441\u0438\u044e, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e:<\/p>\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c \u043c\u0435\u043d\u044e \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0433\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u043d\u0430\u043b\u0438\u0447\u0438\u0435 \u043e\u043f\u0446\u0438\u0438 &#171;\u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f&#187; (&#171;Install app&#187;)<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u0423\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c PWA \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<ol start=\"4\">\n<li>\n<p>\u0417\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c PWA \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><figcaption><\/figcaption><\/figure>\n<ol start=\"5\">\n<li>\n<p>PWA \u0432\u0435\u0440\u0441\u0438\u044f Google Maps \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0442\u0430\u043a:<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0422\u0430\u043a\u0436\u0435 \u043c\u043e\u0436\u043d\u043e \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c PWA \u0432\u0435\u0440\u0441\u0438\u044e \u0438 \u043d\u0430 \u041f\u041a:<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><figcaption><\/figcaption><\/figure>\n<p>\u0438\u043b\u0438<\/p>\n<figure class=\"\"><figcaption><\/figcaption><\/figure>\n<p>\u0412\u043e\u0442 \u0442\u0430\u043a \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 desktop \u0432\u0435\u0440\u0441\u0438\u044f PWA:<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<hr\/>\n<p><a class=\"anchor\" name=\"brauzer\" id=\"brauzer\"><\/a><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td data-colwidth=\"248\" width=\"248\">\n<p align=\"left\"><strong>\u041e\u0431\u043b\u0430\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041a\u043b\u0438\u0435\u043d\u0442<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"248\" width=\"248\">\n<p align=\"left\"><strong>\u041a\u043b\u0430\u0441\u0441<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0411\u0440\u0430\u0443\u0437\u0435\u0440 (\u041e\u0431\u043e\u0437\u0440\u0435\u0432\u0430\u0442\u0435\u043b\u044c)<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"248\" width=\"248\">\n<p align=\"left\"><strong>\u041e\u0431\u044a\u0435\u043a\u0442\u044b<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212; Google Chrome<br \/>&#8212; Firefox<br \/>&#8212; Safari<br \/>&#8212; Opera<br \/>&#8212; Microsoft Edge<br \/>&#8212; Web Desktop App (Chromium)<br \/>&#8212; UC Browser<br \/>&#8212; \u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0435 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u044b \u043d\u0430 Android (Mi Browser, Samsung Internet Browser, HUAWEI Browser \u0438 \u0434\u0440.)<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<ul>\n<li>\n<p>\u0415\u0441\u043b\u0438 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e \u044d\u0442\u043e \u00ab\u0431\u0430\u0437\u0430\u00bb, \u0442\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u2014 \u044d\u0442\u043e \u0442\u043e\u0447\u043a\u0430 \u0432\u0445\u043e\u0434\u0430 \u0432 Web. \u041a\u043b\u0438\u0435\u043d\u0442, \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u0443\u0436\u0435 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435 \u043e\u0431\u0449\u0435\u043d\u0438\u0435 \u0441 Web&#8217;\u043e\u043c, \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446 \u0438 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0441 \u044d\u0442\u0438\u043c\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430\u043c\u0438.<\/p>\n<\/li>\n<li>\n<p>\u0411\u0440\u0430\u0443\u0437\u0435\u0440 \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437: \u0434\u0432\u0438\u0436\u043a\u0430 (<strong>Engine<\/strong>), \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 (<strong>UI<\/strong>), \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0430 \u0434\u0430\u043d\u043d\u044b\u0445 (<strong>Data<\/strong>), \u0434\u0432\u0438\u0436\u043a\u0430 JavaScript (<strong>Interpreter<\/strong>), \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c\u0430 \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 (<strong>Render<\/strong>), \u0441\u0435\u0442\u0435\u0432\u044b\u0445 \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u043e\u0432 (<strong>Networking<\/strong>).<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430 \u0440\u0430\u0437\u043d\u044b\u0445 (\u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u043c\u044b\u0445) \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430\u0445 \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u043e:<\/p>\n<ul>\n<li>\n<p>\u041e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 UI \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 (\u0438\u0445 \u043d\u0430\u043b\u0438\u0447\u0438\u0435, \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0435 \u0434\u0438\u0437\u0430\u0439\u043d\u0443).<\/p>\n<\/li>\n<li>\n<p>\u0420\u0430\u0431\u043e\u0442\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u0438 (\u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0430 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u0432, \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432, \u043d\u043e\u0442\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438).<\/p>\n<\/li>\n<li>\n<p>\u0412\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 (\u0432\u0438\u0434\u0435\u043e, \u0430\u0443\u0434\u0438\u043e, \u044d\u043b\u0435\u043a\u0442\u0440\u043e\u043d\u043d\u044b\u0435 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u044b).<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p>\u0414\u043b\u044f \u043a\u0440\u043e\u0441\u0441-\u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043d\u043e\u0433\u043e \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u043c\u043e\u0433\u0443\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0442\u0430\u043a\u0438\u0435 \u0441\u0435\u0440\u0432\u0438\u0441\u044b \u043a\u0430\u043a\u00a0<a href=\"https:\/\/crossbrowsertesting.com\/\">SMARTBEAR CrossBrowserTesting<\/a>\u00a0\u0438\u043b\u0438\u00a0<a href=\"https:\/\/www.browserstack.com\/\">BrowserStack<\/a>, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0442 \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0448\u0438\u0440\u043e\u043a\u043e\u043c\u0443 \u0441\u043f\u0435\u043a\u0442\u0440\u0443 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0432\u0438\u0434\u043e\u0432 \u0438 \u0432\u0435\u0440\u0441\u0438\u0439 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041a\u0435\u0439\u0441 \u0441 \u0440\u0435\u0430\u043b\u044c\u043d\u044b\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u043e\u043c \u2014 \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0437\u0432\u0443\u043a\u043e\u0432 \u0432 Chrome \u0438 Safari:<\/summary>\n<div class=\"spoiler__content\">\n<p><em>\u0412 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435 \u0435\u0441\u0442\u044c \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 \u0441\u043e\u0431\u044b\u0442\u0438\u044f, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0437\u0430\u0432\u044f\u0437\u0430\u043d\u0430 \u0440\u0430\u0431\u043e\u0442\u0430 \u0447\u0430\u0441\u0442\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u0430. \u041e\u0434\u043d\u043e \u0438\u0437 \u0442\u0430\u043a\u0438\u0445 \u0441\u043e\u0431\u044b\u0442\u0438\u0439 \u2014 &#171;onClick&#187;: \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u00ab\u0441\u043b\u0443\u0448\u0430\u0435\u0442\u00bb, \u043a\u043e\u0433\u0434\u0430 \u043f\u0440\u043e\u0438\u0437\u043e\u0439\u0434\u0451\u0442 \u043a\u043b\u0438\u043a \u043c\u044b\u0448\u043a\u043e\u0439. \u041d\u0430 \u044d\u0442\u043e \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u0431\u044b\u043b\u043e \u0437\u0430\u0432\u044f\u0437\u0430\u043d\u043e \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0437\u0432\u0443\u043a\u043e\u0432, \u0438, \u043a\u043e\u0433\u0434\u0430 \u043a\u043b\u0438\u043a \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u043b, \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0437\u0430\u043f\u043e\u043c\u0438\u043d\u0430\u043b, \u0447\u0442\u043e \u043d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u0438\u0433\u0440\u0430\u0442\u044c \u0437\u0432\u0443\u043a \u0432 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442. \u041e\u0434\u043d\u0430\u043a\u043e \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435 Safari \u044d\u0442\u043e\u0442 \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c \u0440\u0430\u0431\u043e\u0442\u0430\u043b \u0438\u043d\u0430\u0447\u0435 \u0447\u0435\u043c \u0432 Google Chrome \u2014 \u0435\u0441\u043b\u0438 \u043e\u0431\u043d\u043e\u0432\u0438\u0442\u044c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443, \u0442\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u00ab\u0437\u0430\u0431\u044b\u0432\u0430\u043b\u00bb \u043e \u0442\u043e\u043c, \u0447\u0442\u043e \u0441\u043e\u0431\u044b\u0442\u0438\u0435 &#171;onClick&#187; \u0443\u0436\u0435 \u0431\u044b\u043b\u043e \u0438 \u0437\u0432\u0443\u043a \u0432 \u043d\u0443\u0436\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u043d\u0435 \u043f\u0440\u043e\u0438\u0433\u0440\u044b\u0432\u0430\u043b\u0441\u044f.<\/em><\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u043e\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c Web \u043d\u0430 \u0435\u0449\u0451 \u043d\u0435 \u0440\u0435\u043b\u0438\u0437\u043d\u044b\u0445 \u0432\u0435\u0440\u0441\u0438\u044f\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432 (\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: Chrome Beta, Chrome Dev, Chrome Canary).<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u043e\u0434\u043e\u043b\u0436\u0430\u044f \u0440\u0430\u0437\u0433\u043e\u0432\u043e\u0440 \u043e \u0440\u0430\u0437\u043d\u044b\u0445 \u0432\u0435\u0440\u0441\u0438\u044f\u0445, \u0441\u0442\u043e\u0438\u0442 \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c, \u0447\u0442\u043e \u0435\u0441\u0442\u044c \u0440\u0430\u0437\u043b\u0438\u0447\u0438\u044f \u043c\u0435\u0436\u0434\u0443 \u0441\u0442\u0430\u0440\u044b\u043c\u0438 \u0438 \u043d\u043e\u0432\u044b\u043c\u0438 \u0432\u0435\u0440\u0441\u0438\u044f\u043c. \u0414\u0435\u0444\u0435\u043a\u0442\u044b \u0432 \u0441\u0442\u0430\u0440\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 \u0438\u043b\u0438 \u043a\u0440\u0438\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0432 \u043d\u043e\u0432\u043e\u0439 \u043c\u043e\u0433\u0443\u0442 \u043f\u043e\u0432\u043b\u0438\u044f\u0442\u044c \u043d\u0430 \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u0443\u044e \u0440\u0430\u0431\u043e\u0442\u0443 Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, 100-\u044b\u0439 \u043d\u043e\u043c\u0435\u0440 \u0432\u0435\u0440\u0441\u0438\u0438 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u043e\u0433 \u043d\u0435\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u0438\u043d\u0442\u0435\u0440\u043f\u0440\u0435\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u0430\u0439\u0442\u044b).<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary> Change Log \u0438 Release Notes \u0440\u0430\u0437\u043d\u044b\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432:<\/summary>\n<div class=\"spoiler__content\">\n<p>\u0417\u0434\u0435\u0441\u044c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u044b \u0441\u0441\u044b\u043b\u043a\u0438 \u043d\u0430 \u0441\u043f\u0438\u0441\u043a\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u0432\u0435\u0440\u0441\u0438\u0439 \u043d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432, \u0432 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0432\u0441\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043e\u0442 \u0432\u0435\u0440\u0441\u0438\u0438 \u043a \u0432\u0435\u0440\u0441\u0438\u0438:<\/p>\n<p>Chrome:\u00a0<a href=\"https:\/\/chromium.googlesource.com\/chromium\/src\/\">https:\/\/chromium.googlesource.com\/chromium\/src<\/a><\/p>\n<p>Firefox:\u00a0<a href=\"https:\/\/www.mozilla.org\/en-US\/firefox\/releases\/\">https:\/\/www.mozilla.org\/en-US\/firefox\/releases<\/a><\/p>\n<p>Opera:\u00a0<a href=\"https:\/\/blogs.opera.com\/desktop\/changelog-for-86\/\">https:\/\/blogs.opera.com\/desktop\/changelog-for-86<\/a><\/p>\n<p>Safari:\u00a0<a href=\"https:\/\/developer.apple.com\/documentation\/safari-release-notes\">https:\/\/developer.apple.com\/documentation\/safari-release-notes<\/a><\/p>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u0418 \u0432 \u0434\u043e\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u0435 \u0442\u0435\u043c\u0430\u0442\u0438\u043a\u0438 \u0440\u0430\u0437\u043d\u043e\u0432\u0438\u0434\u043d\u043e\u0441\u0442\u0435\u0439 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432 \u0445\u043e\u0442\u0435\u043b\u043e\u0441\u044c \u0431\u044b \u043e\u0442\u043c\u0435\u0442\u0438\u0442\u044c \u0442\u0430\u043a\u043e\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u043a\u0430\u043a &#171;Geo-Specific&#187;. \u0418\u043d\u044b\u043c\u0438 \u0441\u043b\u043e\u0432\u0430\u043c\u0438, \u0432\u0435\u0440\u0441\u0438\u0438 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432, \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u0447\u043d\u044b\u0435 \u0434\u043b\u044f \u043a\u0430\u043a\u043e\u0433\u043e-\u0442\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u043e\u0433\u043e \u0433\u0435\u043e\/\u0441\u0442\u0440\u0430\u043d\u044b\/\u0440\u0435\u0433\u0438\u043e\u043d\u0430 (\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: &#171;Coc Coc&#187; \u0434\u043b\u044f \u0412\u044c\u0435\u0442\u043d\u0430\u043c\u0430).<\/p>\n<\/li>\n<\/ul>\n<ul>\n<li>\n<p>\u0412 \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0438\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u0441\u0430\u043c\u044b\u0439 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u043c \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u043c \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f Google Chrome, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u0434\u0432\u0438\u0436\u043e\u043a Blink (\u044d\u0442\u043e\u0442 \u0434\u0432\u0438\u0436\u043e\u043a \u0442\u0430\u043a\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432 Opera, Microsoft Edge).<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u0421\u0442\u0430\u0442\u0438\u0441\u0442\u0438\u043a\u0430 \u043f\u043e \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0430\u043c \u043d\u0430 2021 \u0433\u043e\u0434 (\u041f\u043e \u0432\u0435\u0440\u0441\u0438\u0438 Affde):<\/summary>\n<div class=\"spoiler__content\">\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<\/p>\n<\/div>\n<\/details>\n<hr\/>\n<p><a class=\"anchor\" name=\"verstka\" id=\"verstka\"><\/a><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td data-colwidth=\"252\" width=\"252\">\n<p align=\"left\"><strong>\u041e\u0431\u043b\u0430\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u042d\u043a\u0440\u0430\u043d (\u041e\u043a\u043d\u043e)<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"252\" width=\"252\">\n<p align=\"left\"><strong>\u041a\u043b\u0430\u0441\u0441<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0412\u0451\u0440\u0441\u0442\u043a\u0430<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"252\" width=\"252\">\n<p align=\"left\"><strong>\u041e\u0431\u044a\u0435\u043a\u0442\u044b<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212; \u0420\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0435<br \/>&#8212; \u0421\u043e\u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u0435 \u0441\u0442\u043e\u0440\u043e\u043d<br \/>&#8212; \u041e\u0440\u0438\u0435\u043d\u0442\u0430\u0446\u0438\u044f<br \/>&#8212; \u0421\u0442\u0440\u0430\u043d\u0438\u0446\u0430<br \/>&#8212; \u041c\u0430\u0441\u0448\u0442\u0430\u0431<br \/>&#8212; \u0410\u0434\u0430\u043f\u0442\u0430\u0446\u0438\u044f<br \/>&#8212; \u042d\u043b\u0435\u043c\u0435\u043d\u0442\u044b<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<ul>\n<li>\n<p>\u0412\u0451\u0440\u0441\u0442\u043a\u0430 Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b (<strong>Layout<\/strong>) \u2014 \u044d\u0442\u043e \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430 \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 HTML-\u0440\u0430\u0437\u043c\u0435\u0442\u043a\u0438 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c CSS-\u0441\u0442\u0438\u043b\u0435\u0439.<\/p>\n<\/li>\n<li>\n<p>\u0421\u0430\u043c\u0430 \u043f\u043e \u0441\u0435\u0431\u0435 Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430, \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u0435\u0441\u043b\u0438 \u044d\u0442\u043e Web-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0438\u0437 \u0441\u0435\u0431\u044f UI, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0434\u043e\u043b\u0436\u0435\u043d \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u043d\u0435\u043a\u0438\u043c UX \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u0430\u043c:<\/p>\n<ul>\n<li>\n<p>UI (<strong>User Interface<\/strong>) \u2014 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u043a\u0430\u043a \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u0439.<\/p>\n<\/li>\n<li>\n<p>UX (<strong>User Experience<\/strong>) \u2014 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u043e\u043f\u044b\u0442 \u043a\u0430\u043a \u043e\u0436\u0438\u0434\u0430\u043d\u0438\u044f \u0434\u043b\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435\u0439.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p>\u0414\u043b\u044f UI \u0447\u0430\u0441\u0442\u0438 Web&#8217;\u0430, \u043a\u0430\u043a \u043f\u0440\u0430\u0432\u0438\u043b\u043e, \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0434\u0438\u0437\u0430\u0439\u043d-\u043c\u0430\u043a\u0435\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043a\u0438 \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e UI \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435:<\/p>\n<ul>\n<li>\n<p>\u0440\u0430\u0437\u043c\u0435\u0440\u044b \u0432 \u043f\u0438\u043a\u0441\u0435\u043b\u044f\u0445<\/p>\n<\/li>\n<li>\n<p>\u0444\u043e\u0440\u043c\u0443<\/p>\n<\/li>\n<li>\n<p>\u0446\u0432\u0435\u0442<\/p>\n<\/li>\n<li>\n<p>\u043e\u0442\u0441\u0442\u0443\u043f\u044b \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0434\u0440\u0443\u0433\u0438\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0438 \u0434\u0440.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<ul>\n<li>\n<p>\u041f\u043e\u043c\u0438\u043c\u043e \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432, \u043d\u0430 \u043c\u0430\u043a\u0435\u0442\u0435 \u043e\u0442\u0440\u0430\u0436\u0435\u043d\u043e \u0438 \u0438\u0445 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044f \u043f\u043e\u043b\u043d\u0443\u044e \u043a\u043e\u043c\u043f\u043e\u0437\u0438\u0446\u0438\u044e.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u0414\u0438\u0437\u0430\u0439\u043d \u0442\u0430\u043a\u0436\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0443\u0441\u043b\u043e\u0432\u0438\u044f \u0434\u043b\u044f \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u0433\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0432\u0451\u0440\u0441\u0442\u043a\u0438:<\/summary>\n<div class=\"spoiler__content\">\n<ul>\n<li>\n<p>\u0434\u043e\u043f\u0443\u0441\u0442\u0438\u043c\u043e\u0435 \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u044d\u043a\u0440\u0430\u043d\u0430 \u0438 \u0441\u043e\u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u0435 \u0441\u0442\u043e\u0440\u043e\u043d<\/p>\n<\/li>\n<li>\n<p>\u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0430\u0434\u0430\u043f\u0442\u0430\u0446\u0438\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/p>\n<\/li>\n<li>\n<p>\u0433\u0440\u0430\u043d\u0438\u0446\u044b, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043d\u0430 \u0430\u0434\u0430\u043f\u0442\u0438\u0432\u043d\u044b\u0439 \u0434\u0438\u0437\u0430\u0439\u043d (\u0442\u043e\u0447\u043a\u0438 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0430)<\/p>\n<\/li>\n<li>\n<p>\u043d\u0430\u043b\u0438\u0447\u0438\u0435 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/p>\n<\/li>\n<li>\n<p>\u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u043e\u0432<\/p>\n<\/li>\n<li>\n<p>\u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u043c\u044b\u0439 \u043c\u0430\u0441\u0448\u0442\u0430\u0431 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u041e\u0441\u043d\u043e\u0432\u044b\u0432\u0430\u044f\u0441\u044c \u043d\u0430 \u0442\u0430\u043a\u043e\u043c \u043c\u0430\u043a\u0435\u0442\u0435, \u0432 \u0442\u043e\u0439 \u0438\u043b\u0438 \u0438\u043d\u043e\u0439 \u043c\u0435\u0440\u0435 \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u043e\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u0451\u0440\u0441\u0442\u043a\u0443 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0438 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0435 UI \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0430 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0435 \u0438\u0445 \u0434\u0438\u0437\u0430\u0439\u043d\u0443 \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u0442\u0435\u0441\u0442\u043e\u0432\u044b\u0445 \u0441\u0440\u0435\u0434\u0430\u0445 \u0438 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u044f\u0445.<\/p>\n<\/li>\n<li>\n<p>\u0414\u043b\u044f \u044d\u043c\u0443\u043b\u044f\u0446\u0438\u0438 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0439, \u0441\u043e\u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u0439 \u0441\u0442\u043e\u0440\u043e\u043d \u0438 \u043f\u0440\u043e\u0447\u0435\u0433\u043e \u043d\u0430 \u041f\u041a \u0432 DevTools \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 &#171;Toggle Device Toolbar&#187;.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 &#171;Device Toolbar&#187; \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b:<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c DevTools \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 (F12 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e).<\/p>\n<\/li>\n<li>\n<p>\u0412\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043f\u0430\u043d\u0435\u043b\u044c \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430 (&#171;Toggle Device Toolbar&#187;).<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u0412 \u0432\u044b\u043f\u0430\u0434\u0430\u044e\u0449\u0435\u043c \u0441\u043f\u0438\u0441\u043a\u0435 &#171;Dimensions&#187; \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u043f\u0440\u0435\u0441\u0435\u0442 \u0441 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u043c \u0434\u043b\u044f \u0442\u0435\u0441\u0442\u0430 \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0435\u043c.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<ol start=\"4\">\n<li>\n<p>\u0420\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u043c\u043e\u0436\u043d\u043e \u0432\u044b\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0438 \u0432 \u0440\u0443\u0447\u043d\u0443\u044e, \u043a\u0430\u043a\u043e\u0435 \u0443\u0433\u043e\u0434\u043d\u043e (\u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e &#171;Dimensions&#187; \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u0432 \u0440\u0435\u0436\u0438\u043c &#171;Responsive&#187;).<\/p>\n<\/li>\n<li>\n<p>\u0427\u0442\u043e\u0431\u044b \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c Web \u043d\u0430 \u0430\u0434\u0430\u043f\u0442\u0438\u0432, \u0432 \u0440\u0435\u0436\u0438\u043c\u0435 &#171;Responsive&#187; \u043c\u043e\u0436\u043d\u043e \u0441\u0434\u0432\u0438\u0433\u0430\u0442\u044c \u0441\u0442\u043e\u0440\u043e\u043d\u044b \u044d\u043c\u0443\u043b\u0438\u0440\u0443\u0435\u043c\u043e\u0433\u043e \u044d\u043a\u0440\u0430\u043d\u0430. \u041d\u043e \u043e\u0431\u044b\u0447\u043d\u043e \u044d\u0442\u043e\u0433\u043e \u043d\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f, \u043a\u043e\u0433\u0434\u0430 \u0442\u043e\u0447\u043d\u043e \u0438\u0437\u0432\u0435\u0441\u0442\u043d\u044b \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u043c\u044b\u0435 \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u044f \u0434\u043b\u044f Web&#8217;\u0430.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><figcaption><\/figcaption><\/figure>\n<ol start=\"6\">\n<li>\n<p>\u041e\u0440\u0438\u0435\u043d\u0442\u0430\u0446\u0438\u044f \u0438\u0437 &#171;\u043a\u043d\u0438\u0436\u043d\u043e\u0439&#187; \u0432 &#171;\u0430\u043b\u044c\u0431\u043e\u043c\u043d\u0443\u044e&#187; \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043a\u043d\u043e\u043f\u043a\u0438 &#171;Rotate&#187;.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><figcaption><\/figcaption><\/figure>\n<ol start=\"7\">\n<li>\n<p>\u0418\u0437 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0432 \u044d\u0442\u043e\u043c \u043e\u043a\u043d\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u0435\u0449\u0451 \u043f\u0440\u0438\u0433\u043e\u0434\u0438\u0442\u044c\u0441\u044f:<\/p>\n<\/li>\n<\/ol>\n<ul>\n<li>\n<p>Show rulers (\u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u043b\u0438\u043d\u0435\u0439\u043a\u0443 \u0434\u043b\u044f \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u044f \u043e\u043a\u043d\u0430)<\/p>\n<\/li>\n<li>\n<p>Show media queries (\u041f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 CSS \u043c\u0435\u0434\u0438\u0430-\u0437\u0430\u043f\u0440\u043e\u0441\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u044e\u0442 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0441\u0442\u0438\u043b\u0435\u0439 \u0434\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0441 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u043c \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0435\u043c \u043e\u043a\u043d\u0430)<\/p>\n<\/li>\n<li>\n<p>Capture screenshot (Capture full size screenshot) (\u0421\u0434\u0435\u043b\u0430\u0442\u044c \u0441\u043a\u0440\u0438\u043d\u0448\u043e\u0442 Web-\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0432 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u043e\u043c \u0440\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u0438 \u043e\u043a\u043d\u0430)<\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/details>\n<ul>\n<li>\n<p>\u041c\u0435\u043d\u044f\u0442\u044c \u043c\u0430\u0441\u0448\u0442\u0430\u0431 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043c\u043e\u0436\u043d\u043e \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0442\u0430\u043a \u0436\u0435 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u043e\u0433\u043e \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0430 (\u0432 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u0445 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u0438\u043b\u0438 \u043f\u043e \u0433\u043e\u0440\u044f\u0447\u0438\u043c \u043a\u043b\u0430\u0432\u0438\u0448\u0430\u043c):<\/p>\n<\/li>\n<\/ul>\n<figure class=\"\"><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0414\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u0443\u0437\u043d\u0430\u0442\u044c \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043a\u0438 (\u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b) \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 (\u0435\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u044b, HEX-\u043a\u043e\u0434 \u0446\u0432\u0435\u0442\u0430 \u0438 \u043f\u0440.), \u0432\u043d\u043e\u0432\u044c \u043f\u043e\u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u043e\u0431\u0440\u0430\u0442\u0438\u0442\u044c\u0441\u044f \u043a DevTools.<\/p>\n<\/li>\n<\/ul>\n<details class=\"spoiler\">\n<summary>\u0418\u043d\u0441\u043f\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e DevTools:<\/summary>\n<div class=\"spoiler__content\">\n<ol>\n<li>\n<p>\u041e\u0442\u043a\u0440\u044b\u0442\u044c DevTools \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 (F12 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e).<\/p>\n<\/li>\n<li>\n<p>\u0412\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u0440\u0435\u0436\u0438\u043c \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f (&#171;Select an element in the page to inspect it&#187;).<\/p>\n<\/li>\n<\/ol>\n<figure class=\"\"><figcaption><\/figcaption><\/figure>\n<ol start=\"3\">\n<li>\n<p>\u041d\u0430\u0432\u0435\u0441\u0442\u0438 \u043a\u0443\u0440\u0441\u043e\u0440 \u043d\u0430 \u0442\u0440\u0435\u0431\u0443\u0435\u043c\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 (\u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u0438 \u0435\u0433\u043e \u0433\u0440\u0430\u043d\u0438\u0446\u044b \u0434\u043e\u043b\u0436\u043d\u044b \u043f\u043e\u0434\u0441\u0432\u0435\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0434\u043e\u043b\u0436\u0435\u043d \u043e\u0442\u043a\u0440\u044b\u0442\u044c\u0441\u044f \u0442\u0443\u043b\u0442\u0438\u043f \u0441 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u0430\u043c\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430).<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<ol start=\"4\">\n<li>\n<p>\u041a\u043b\u0438\u043a\u043d\u0443\u0442\u044c \u043f\u043e \u0432\u044b\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u043c\u0443 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0443, \u0434\u043b\u044f \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u044f \u0435\u0433\u043e \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u043e\u0432 \u0432 DevTools.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<ol start=\"5\">\n<li>\n<p>\u041d\u0430 \u0441\u043e\u0441\u0435\u0434\u043d\u0435\u0439 \u0432\u043a\u043b\u0430\u0434\u043a\u0435 \u0431\u0443\u0434\u0435\u0442 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u043e CSS-\u0441\u0442\u0438\u043b\u044f\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<ol start=\"6\">\n<li>\n<p>\u0415\u0441\u043b\u0438 \u043e\u0442\u043a\u0440\u044b\u0442\u044c \u0432\u043a\u043b\u0430\u0434\u043a\u0443 \u0441<\/p>\n<\/li>\n<\/ol>\n<\/div>\n<\/details>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-333939","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/333939","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=333939"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/333939\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=333939"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=333939"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=333939"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}