Что такое платформа браузера

Обновлено: 07.07.2024

Когда дело доходит до создания веб-сайта, вы можете узнать много разных терминов, таких как: платформа веб-сайта, хостинг, системы управления контентом и многое другое.

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

Из этой статьи вы узнаете, что такое платформы веб-сайтов, некоторые термины, связанные с этим, и какие шаги необходимо предпринять для выбора веб-хостинга. В конечном счете, я надеюсь, знание этого поможет вам выбрать нужную вам платформу для создания вашего сайта.

Что такое платформа для веб-сайтов?

  • Платформа веб-хостинга
  • Языки программирования
  • Инструменты для создания веб-сайтов

Все это взаимосвязано и от правильной работы всех этих частей, как по отдельности, так и вместе, будет зависеть хорошая работа вашего сайта, а значит и то, насколько комфортно будет посетителям вашего сайта.

Платформа веб-хостинга

Хостинги предлагают различные типы платформ. Как правило, это два типа операционных семейств: Linux и Windows.

Linux

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

Этот тип операционной системы отлично подходит для новичков, поскольку позволяет легко устанавливать простые в использовании панели управления и мониторинга, такие как cPanel, с помощью которых, веб-мастер сможет полностью управлять своим хостингом: припарковать домен, настроить электронную почту, управлять базами данных, устанавливать различные веб-приложения, такие как WordPress, приложения для ведения электронной торговли и многое другое.

cPanel

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

Windows

Обычно Windows ассоциируется с персональными компьютерами. Но на самом деле, эти операционные системы, также можно часто встретить на хостингах. Хотя это возможно, создать простой сайт на базе этой ОС, но чаще всего, Windows используется крупными предприятиями.

Отмечу, что в Windows есть панель инструментов под названием Plesk, которая имеет аналогичные функции с cPanel.

Панель управления Plesk

Языки программирования.

В операционных системах Linux и Windows используются разные языки программирования. Если с помощью HTML и CSS создаются простые, статичные сайты, то с помощью языков программирования, эти сайты становятся интерактивными. Пользователь может взаимодействовать с различными формами, в том числе, что-то искать на сайте, регистрироваться, фильтровать информацию и многое другое.

Язык программирования PHP

Хотя языков программирования, на которых можно создать сайт, довольно много вот самые распространенные из них:

PHP может генерировать HTML для веб-страниц, обрабатывать формы и многое другое. Самым распространенным примером использования PHP, является система управления контентом, известная как WordPress, которая является самой распространенной CMS в мире.

C ++ является расширением языка программирования C и используется во многих программах общего назначения, которые обычно используются в инфраструктурах больших систем, а также в ресурсоемких приложениях. Некоторые примеры использования C ++ включают видеоигры и телефонные коммутаторы.

Python

JavaScript

JavaScript, используется наряду с HTML и CSS. Это язык, используемый в веб-браузерах.

Примером функциональности, которую может выполнять JavaScript, являются плавно работающие раскрывающиеся меню в навигации вашего веб-сайта, проверка логики заполнения форм перед их отправкой на сервер, и многое другое. Именно на этом языке программирования, обычно вставляется рекламный код от рекламных сетей.

Для большинства владельцев веб-сайтов, при разработке своего сайта, вам понадобится возможность использовать HTML, PHP и MySQL.

Инструменты для создания веб-сайтов

Пока что эта статья коснулась только части хостинга, а не тех частей, с которыми вы будете работать больше всего, например, инструментов для создания веб-сайтов, необходимых для того, чтобы ваш веб-сайт был в хорошем состоянии и работал.

Примеры инструментов для создания веб-сайтов:

  • Системы разработки
  • Системы управления контентом (CMS)
  • Конструкторы шаблонов сайтов

Системы разработки.

Если вы разработчик, у которого есть особые потребности, и вы не хотите использовать готовые системы управления сайтами, вы можете использовать системы разработки для создания своего сайта.

Системы управления контентом.

CMS WordPress

Система управления контентом (Content Management System), также известная как CMS, представляет собой специально разработанное программное обеспечение, которое позволяет владельцу веб-сайта, создавать большинство типов веб-сайтов, таких как блоги, сайты электронной коммерции, бизнес сайты и другие.

Большинство CMS построены для облегчения создания сайта обычными пользователями, которые не eмеют программировать.

Популярными примерами CMS являются WordPress, Drupal и Joomla, которые подходят для создания большинства типов веб-сайтов и довольно популярны среди блогеров и владельцев небольших бизнес сайтов..

Из этих трех CMS, WordPress считается наиболее удобным и лёгким в освоении. Возможно, именно поэтому его используют всё больше людей по всему миру. На октябрь 2020 года, на WordPress работает примерно 35% от всех сайтов в интернете. Так же почитайте статью про CMS онлайн магазинов.

Конструкторы сайтов.

Конструктор сайтов Wix

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

В чём-то, конструкторы сайтов напоминают системы управления контентом. Ведь у них много общего. В первую очередь, это простота создания сайта. Но есть и принципиальное различие: CMS, такая как WordPress, позволяет сделать намного больше.

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

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

Почему так важен выбор правильных платформ для веб-сайтов?

Теперь, вы знаете, что такое платформы веб-сайтов, но почему это важно знать?

Выбор правильной платформы для веб-сайтов имеет значение, потому что это фундамент вашего сайта. От правильного выбора платформы, будет зависеть, как будет работать ваш сайт сегодня и через год. И с платформой нужно определиться в самом начале, ещё до создания сайта. Потому-что позже, сменить платформу, будет невероятно сложно.

Переместить сайт с крупным функционалом с Linux на Windows, это сложная задача. Каждый из языков программирования, имеет свои особенности, и сменить язык программирования, означает полное переписывание кода всего сайта, то есть, по сути, создание кода сайта с нуля.

Сменить конструктор сайта на систему управления контентом, также невероятно сложно и трудоёмко.

Поэтому, исходя из своих потребностей, выбирайте правильные платформы, и уже исходя из выбранных платформ, выбирайте соответствующие тарифы на хостинге.

Также в зависимости от ваших потребностей, вам понадобится виртуальный хостинг, хостинг на VPS/VDS, или даже отдельный сервер.

Тарифы на хостинг

Что теперь?

Хостингов очень много. Прежде чем вы перейдете к заказу, пройдите следующие шаги:

  1. Определите, какой тип веб-сайта вы хотите запустить.
  2. Определитесь со своим бюджетом.
  3. Изучите различные веб-хостинговые компании.
  4. Если у вас возникнут какие-либо вопросы, обращайтесь напрямую в службу поддержки веб-хостинга, заодно, как раз протестируете поддержку хостинга, что тоже имеет значение.

А если у вас остались ещё вопросы, касательно выбора платформы для сайта, то задавайте их ниже, в разделе с комментариями.

Помните эту статью? Раньше мы могли быстро собрать статичную HTML-страничку в каком-нибудь FrontPage и сайт был готов. С этим мог справится любой студент. В более сложном случае, мы писали пару строк на PHP и получали уже целый портал, собранный из разных элементов шаблона на сервере. Затем мы захотели, чтобы наш сайт как-то выделялся на общем фоне и умел чуть-чуть больше. Трон занял его-величество jQuery. Теперь же, мы оказались погребены под завалами фреймворков и библиотек, инструментов сборки, менеджеров зависимостей, препроцессоров и постпроцессоров, особых форматов, языков и стилей программирования, чтобы иметь возможность стряпать простые лэндинги. Все стало слишком сложно. Спикеры на конференциях стали соревноваться в изощренности того, каким еще образом можно сломать нам мозг. Как мы докатились до жизни такой? Чем «раньше» так сильно отличается от «сейчас»? Что нас ждет «потом»? Есть ли в современной веб-разработке некий дзен-стайл, блюдя который, можно, как в старые добрые времена, собрать себе уютный сайтик «на коленке» за пару вечеров, без ковыряния в документации десятка хипстерских технологий-однодневок? Насколько доступны нам простые решения в серьезной промышленной разработке? Куда движется веб-платформа? Предлагаю разобраться.

Для того, чтобы поэкспериментировать с практической частью, вам понадобится любой удобный редактор кода (например Visual Studio Code) и актуальная версия браузера Chrome. Для начала этого будет вполне достаточно. Впоследствии (я планирую целый цикл публикаций на эту тему), все неминуемо усложнится, но мы будем стараться оставаться «в рамках» — это наша цель.

Предпосылки и решение

Когда я делал свои первые сайты (в конце 90-х — начале 2000-х), первое, что мне показалось странным и ужасно неудобным в обычном HTML — невозможность описать «заголовок», «подвал» и «главное меню» сайта в одном месте для всех страниц сразу. Я мог вставить одну картинку или один скрипт во многих местах, но не банальный кусок разметки. Также, я не мог описать общий макет страницы, без необходимости повторять его в каждом отдельном HTML-файле. Я думаю, многих эти-же причины подтолкнули к первым экспериментам с серверными технологиями. Но для всего серверного нужен соответствующий сервер, а это новый уровень усложнения задачи, казавшейся сперва такой простой. Так или иначе, эта проблема решалась множество раз и множеством способов. Мы пытались использовать iframe, пытались динамически управлять видимостью фрагментов, содержащихся на одной странице; как только не издевались над собой и здравым смыслом. В итоге, мы пришли к современному набору мета-платформ типа React или Vue.js, которые, среди прочего, позволяют нам создать структуру модулей, отражающую структуру того, что мы видим на экране. Но и сама веб-платформа не стоит на месте и, о чудо, теперь у нас есть нативная возможность создавать больше чем просто многократно используемые куски разметки: теперь мы можем создавать свои собственные настоящие HTML-теги! Причем, каждый такой тег может быть как примитивным контейнером, содержащим только необходимое оформление (или быть интерактивным UI-элементом), так и макетом всей страницы. Он даже может содержать в себе целое сложное приложение с кучей, необходимой вам, клиент-серверной логики. Да, я говорю о новом стандарте Custom Elements (Living Standard). И он действительно многое меняет.

Пробуем на вкус

Для первого знакомства давайте воспроизведем вышеописанный кейс с общим макетом, хедером, футером и навигационным меню, в самом примитивном виде:

Файл index.html:


Обратите внимание на именование кастомных тегов: по стандарту оно обязательно должно содержать дефис (один или более). Также, вы, наверное, заметили атрибут «slot» — о нем немного позже.

Теперь перейдем к файлу, описывающему основной макет страницы elements/my-layout.js:


Прошу прощения за избыток стилей в данном примере: они нужны только для наглядности при отображении результата в браузере.

В части шаблона, где находится сама разметка, мы снова встречаем слово «slot» — это специальный тег, который работает в сочетании с ShadowDOM — он определяет позиции в разметке для частей контента нашего элемента. Соответствие определяется тем самым атрибутом «slot», который я упомянул ранее. Если у тега «slot» нет атрибута «name» — в него попадет контент «по умолчанию», который, в свою очередь, не имеет атрибута «slot». Это очень простой, но очень мощный нативный инструмент шаблонизации на «клиент-сайде».

VS Code — пока не умеет автоматически подсвечивать HTML-синтаксис внутри ES6-строк. Для работы с большими участками разметки внутри JS-файлов, вы можете временно переключать синтаксис открытого файла в режим HTML (нижний правый угол окна): вам станет доступна подсветка, подсказки и автодополнение в HTML и CSS.

Создадим остальные элементы. Файл elements/my-menu.js:

Файл elements/my-header.js:


И последний файл нашего нано-проекта elements/my-footer.js:


Та-дам! Можно открывать наш index.html в браузере. Внимательный читатель заметил, что стили для тега «span» были напрямую определены сразу в двух местах (для разных элементов), однако они не повлияли друг-на-друга и отобразились правильно.

Что мы увидели?

Мы увидели пример настоящей модульной разработки без подключения каких-либо внешних библиотек, без настройки окружения, без ожидания сборки проекта, даже без необходимости запускать локальный сервер. В инструментах разработчика браузера мы видим непосредственно свой JS-код и свою собственную разметку, а не результат работы скриптов, создающих за нас DOM. Контент нашего главного HTML-файла находится в нем-же и сразу доступен, опять-же, без какого-либо предварительного рендера. Мы можем повторно использовать наши кастомные теги в этом-же проекте или в любых других. Мы не загрузили ничего лишнего и отобразили страницу практически мгновенно. Объем дополнительного JS-кода, который нам понадобился для этого — микроскопический. При этом, каждый наш новый элемент — это такой-же полноправный DOM-элемент как и любой стандартный div. Для него доступны те-же самые стандартные атрибуты, свойства, события и методы типа addEventListener, appendChild, remove и т. д. Это то, чего мы так долго хотели? По моему, да.

Дальше — больше

В дальнейшем мы рассмотрим следующие темы (не обязательно в указанном порядке):



Доброго времени суток, Хабр! В очередной раз читая комментарии, наткнулся на мысль о том, что далеко не все понимают, как обстоит ситуация с браузерами для Windows на данный момент. От чего хотелось бы провести небольшой обзор текущего положения. Ну, и сразу к делу!

Браузерные движки

Браузер — программа не простая, это целый набор компонентов, взаимодействующих между собой. Для краткого обзора потребуются всего два компонента из множества — движок отрисовки содержимого и движок исполнения JavaScript.

Существующие движки отрисовки содержимого

  • Trident (так же известный как MSHTML) — движок, ранее разрабатываемый Microsoft для браузера Internet Explorer;
  • EdgeHTML — преемник Trident, ранее разрабатываемый Microsoft для браузера Legacy Edge (ранее просто Edge);
  • WebKit — движок, разрабатываемый Apple для браузера Safari;
  • Blink — преемник WebKit, разрабатываемый Google для браузера Chrome;
  • Gecko — движок, разрабатываемый Mozilla для браузера Firefox;
  • Servo — исследовательский проект Mozilla, некоторые технологии со временем перетекают в Gecko.

Существующие движки исполнения JavaScript

  • Chakra JScript — движок JS, ранее разрабатываемый Microsoft для браузера Internet Explorer;
  • Chakra JavaScript — преемник Chakra JScript, ранее разрабатываемый Microsoft для браузера Legacy Edge;
  • Nitro — движок JS, разрабатываемый Apple для браузера Safari;
  • V8 — движок JS, разрабатываемый Google для браузера Chrome;
  • SpiderMonkey — движок JS, разрабатываемый Mozilla для браузера Firefox.

И тут вроде бы очевидно, какие браузеры какие движки используют, но Microsoft внёс не много путаницы в понимание данной темы, поэтому рассмотрим браузеры отдельно.

Браузеры

Chromium


Chromium — это open-source ответвление браузера Chrome. Браузеры на основе Chromium составляют большую часть из всех используемых браузеров на планете Земля.

Обычно, браузеры на базе Chromium между собой отличаются только визуально, ведь у всех под капотом движки Blink и V8, хотя, какие-то компании пытаются привнести больше функционала в браузер, чем имеется.

Это в конечном итоге встанет разработчикам браузеров боком, потому что в любой момент главный разработчик Chromium — Google может вставить палки в колёса разработчикам модификаций.

Всех браузеров на основе Chromium подсчитать одному человеку вряд ли под силу, поэтому приведу список только тех, что помню:

  • Chrome — в представлении не нуждается, браузер от Google;
  • Chr Edge — новый браузер от Microsoft со старым названием. Поговаривают, отличается большей производительностью от Chrome. С некоторых пор предустанавливается в систему;
  • Brave — браузер с повышенной безопасностью настолько, что приватный режим использует Tor;
  • Яндекс.Браузер, Opera, Vivaldi, тысячи их.

Firefox

Firefox использует движки Gecko и SpiderMonkey для своей работы. Имеет небольшое количество базирующихся на Firefox браузеров, но самый известный — Tor Browser. Является единственным рубежом до полного перехода интернета на браузеры на основе Chromium.

Internet Explorer

Это любимая всеми утилита для скачивания браузеров. Как и Chrome — не нуждается в представлении. До 11 версии использовал движки Trident и Chakra JScript. В 11 версии, за исключением режима совместимости, стал использовать движки Trident и Chakra JavaScript. Этот браузер ещё долго будет использоваться для всякого рода систем видеонаблюдения, поскольку имеет, почему-то, популярный в узких кругах API для расширений. В Windows 8 и Windows 8.1 имел особую модификацию движка Trident на базе WinRT для Metro режима.

(Legacy) Edge

Браузер, начавший своё существование с кодовым названием Project Spartan, являлся новым браузером от Microsoft в 2015 году, использующим движки EdgeHTML и Chakra JavaScript. Конечной целью проекта была полная совместимость с сайтами, отлично работающими в Chrome. В итоге — получилось нечто своеобразное, но, очевидно, не выжившее под давлением Google.

Safari


Safari? А нет его больше, этого вашего Safari, кончился.

Нецелевое использование браузеров

Вроде бы браузеры — законченный продукт, ни добавить ни отнять. Однако, они используются в разного рода других приложениях. Причины в следующем (в порядке убывания значимости):

  • П р ограммистов на JS нечем занять;
  • На JS+HTML новичкам проще программировать;
  • Кроссплатформенность;
  • Требуется возможность отображать веб-страницы.

Приведу примеры подобного использования:

Chromium

Нынешние браузеры настолько сложны, что одному человеку создать собственный браузер не под силу (либо это должен быть гений). Они по сложности сравнимы с операционными системами! А, постойте, вот и первый кандидат на нецелевое использование — Chrome OS. Да, весь пользовательский интерфейс — просто модифицированный Chromium.
Однако, помимо этого, в виде CEF (Chromium Embedded Framework), Chromium используется в:

Internet Explorer

Почти любое Win32 приложение, умеющее отображать WEB-страницы и при этом в распакованном виде занимающее меньше 60 мегабайт использует внутри Internet Explorer. Кстати, это касается не только маленьких по размеру приложений, например, Visual Studio использует Internet Explorer для отображения WEB-страниц, когда это требуется в работе IDE. Ещё существуют HTA приложения — древний предшественник CEF на базе Internet Explorer. И ведь до сих пор работает.

(Legacy) Edge

Новым приложениям — новые движки! Любое UWP приложение, использующее внутри отображение WEB-страниц работает на базе Edge. Не то, чтобы Microsoft запрещали использовать что-то другое, но никто просто и не старался. Так же, пока что, в предварительных сборках Windows новая клавиатура с GIF панелью тоже использует Edge для рендеринга. В будущих версиях, полагаю, перейдут на Chr Edge.


Производительность

Постойте, столько приложений, а что там с производительностью? Лично я — не специалист в оценке производительности, но хочу поделится с вами некоторыми занимательными фактами.

Prefetcher

В Windows есть такая штука — Prefetcher. Она занимается подгрузкой программ в ОЗУ при старте ОС и на протяжении её работы. Штука эта достаточно умная, и она анализирует чаще всего запускаемые программы, чтобы в дальнейшем их подгружать.

Как это связано с браузерами? Идея в том, что это может смазать первый пользовательский опыт с другим браузером, например, пользуясь постоянно Chrome, имеете установленную версию Firefox. При запуске Firefox будет вести себя крайне медленно — медленнее, чем ваш основной браузер. Всё потому что он запылился в глазах Prefetcher. В конечном итоге всё будет работать быстро, но первое впечатление после долгого неиспользования будет ужасным. Особенно это касается пользователей с HDD или малым количеством ОЗУ.

Области распределённой памяти

Да, звучит не очень. Но суть, в данном случае, простая — если одна единица исполняемого кода требуется к исполнению больше одного раза, будь то exe или dll , то в память она загрузится лишь один раз. Поясню: если два различных приложения в ходе своей работы загрузят одну и ту же библиотеку, например, edgehtml.dll , то этот файл будет загружен в ОЗУ компьютера на самом деле только один раз, хотя, казалось бы, потребуется два или больше раз. Таким образом ОС экономит нам оперативную память.

Движки нормального человека

К чему это я? А вот дело в том, что в отличии от других браузеров, Internet Explorer и (Legacy) Edge предустановлены в систему, а их движки хранятся в папке System32 . Это, вкупе с API для разработки приложений, означает, что все приложения в системе, использующие данные движки будут загружать их в память только однажды. И этот принцип распространяется на все приложения.

У людей часто возникают проблемы с UWP приложениями, а точнее — с их скоростью запуска. Всё дело в WinRT — огромном наборе библиотек, при помощи которых UWP приложение взаимодействует с ОС. Если не использовать UWP приложения часто, то этот набор библиотек не будет прогружен в памяти полностью, и придётся ожидать окончания этого процесса перед использованием приложения. Но забавный факт — используя два и более UWP приложения время их старта и общая производительность резко увеличиваются и часто даже превосходят Win32 программы. Исключением из этого является приложение "Фотографии" — тут отдельная история, покрытая туманом.

Движки курильщика

А вот с приложениями (в том числе и браузерами) на основе Chromium это так не работает. Каждое приложение комплектует с собой собственную сборку библиотеки CEF, что, кроме раздувания размера приложения, не позволяет операционной системе иметь только одну копию dll в ОЗУ. Итого это сильно замедляет производительность при использовании множества подобных приложений. Помимо того, сам размер CEF довольно удручающий.

Microsoft Store

У многих возникает вопрос — почему в Microsoft Store нет ни одного браузера(не считая нескольких кривых поделок на EdgeHTML)? Ответ, на самом деле, прост — все браузеры, включая Chr Edge имеют собственную систему обновления, что прямо запрещено правилами Microsoft Store. В остальном никто никого не ограничивает.

Как удалить новый Microsoft Edge

Это не очень сложно. Для начала требуется найти папку с Microsoft Edge, она расположена по пути:
C:\Program Files (x86)\Microsoft\Edge\Application
Далее заходим в любую версию Edge и переходим в папку Installer . Полный путь может выглядеть следующим образом:
C:\Program Files (x86)\Microsoft\Edge\Application\83.0.478.58\Installer
Далее необходимо открыть командную строку от имени администратора в данной папке и выполнить следующую команду:
setup.exe --uninstall --system-level --verbose-logging --force-uninstall
Готово! Через несколько секунд этот браузер исчезнет из системы. Но при следующем же обновлении он появится снова, будте бдительны.

Заключение

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

Администраторы Хабра, пожалуйста, почините HabraStorage в Legacy Edge! Совсем не дело.


В данной статье я хочу поделиться мыслями на счёт создания собственного браузерного движка. Мы рассмотрим текущие браузеры и браузерные движки. Вспомним про Modest и узнаем его нелёгкую судьбу.

Это будет цикл статей в которых мы создадим свой собственный минималистичный браузерный движок. Каждая статья будет подкреплена реальным кодом и примерами.
По прошествии десяти статей у нас с вами будет минимальная рабочая версия браузерного движка, сильно минимальная. После этого, если запал не уйдёт и будет интерес сообщества, продолжим, и в итоге доберёмся до JS.

И конечно, первым делом необходимо понять, что такое браузер и браузерный движок.

Браузер и браузерный движок

Существующий мир сложно представить без браузеров. Они есть на многих устройствах: компьютеры, лэптопы, телефоны, игровые приставки. Если представить браузер в виде машины то браузерный движок это всё то, что скрыто под капотом вашего автомобиля.
Браузеры как и автомобили могут отличаться внешним видом и содержимым под капотом. Цвет, кнопочки на панели, аудиосистема. У кого-то под капотом двигатель V8, а у кого-то там масло течёт.

Браузер объединяет периферию и предоставляет функционал позволяющий манипулировать движком, его поведением, предоставляет дополнительные сервисы.
Браузерный движок выполняет всю "грязную" работу: загрузка, обработка, отрисовка данных и все возможные расчёты.

Всё как в автомобилях. Есть салон в котором присутствует педаль газа, тормоза и множество переключателей полезных и понятных пользователю. А есть большая механическая часть скрытая от пользователя под капотом.

Кто создает браузеры и движки

Разработкой собственного браузера занимается множество компаний: Google, Mozilla, Apple, Microsoft, Opera Software, Яндекс, Ростелеком, Vivaldi Technologies, много их…

Каждый добавляет какие-то свои "фишки", сервисы в создаваемый браузер. К примеру, Яндекс интегрирует свои сервисы, поиск.

С браузерными движками дела обстоят кардинально иначе. Вот список движков, их разработчиков и обладателей:

  • Blink: Google
  • Gecko: Mozilla
  • WebKit: Apple
  • EdgeHTML: Microsoft

Это основные обладатели и разработчики движков. В разработке им помогают сторонние компании на определенных условиях.

Например, рассмотрим самый популярный проект от компании Google — Chromium. Данный проект содержит в себе движок Blink. Создавать данный проект Google помогают такие компании как Intel, Facebook, IBM, LG Electronics, NVIDIA, Yandex. Полный список можно посмотреть тут.
Условия на которых компании помогают создавать Blink/Chromium описаны в разделе Legal stuff на сайте проекта Chromium. Если кратко, то всё что вы создаёте принадлежит (не эксклюзивно) Google.

Браузеры компаний Opera, Яндекс, Ростелеком и другие используют именно этот браузерный движок. Если быть до конца откровенным то заявления вроде "у нас есть свой браузер" не совсем правда. Собственные сервисы — да, а вот всё остальное принадлежит другой компании(ям). И эта другая компания предоставляет свой браузерный движок на определенных условиях.

Лицензии браузерных движков

Любой открытый код содержит в себе лицензию с описанием условий по использованию данного кода, и браузерные движки не исключение.

Если сразу и кратко: лицензии сносные, прям вот из ряда вон ничего нет. Кроме EdgeHTML который закрыт. Легально утащить к себе какой-то проект и закрыто разрабатывать/изменять видимо не выйдет. Лицензии призывают к взаимной открытости.

Открытый исходный код, ответвление движка WebKit. Как и в WebKit заявлено четыре лицензии:

Самый популярный браузерный движок. Он входит в состав проекта Chromium. Именно на основе Chromium создают собственные браузеры.

Если верить файлу LICENSE проекта Chromium его основная лицензия 3-Clause BSD. Но у проекта есть директория third_party (третьи лица, третья сторона) содержащая множество стороннего кода от которого проект зависит. Иначе говоря, без этого кода собрать браузер не выйдет. У каждого компонента свои лицензии отличные от того что указано в LICENSE проекта:

Открытый исходный код. Заявлена одна лицензия:

Активно развивается компаний Mozilla и используется в собственном браузере компании — Firefox. Так же используется в браузере Tor Browser обеспечивающий анонимное пребывание в сети.

Как основа для производителей браузеров большой популярности не имеет.

Открытый исходный код. Заявлено четыре лицензии:

Развивается компанией Apple и используется в собственном браузере компании — Safari. Ранее многие компании использовали в своих разработках WebKit, но после покинули проект и переключились на Blink от Google.

Закрытый исходный код. Проприетарная лицензия.

Движок используется для браузера компании Microsoft под названием Edge, который пришёл на смену Internet Explorer. Это их новый движок. Предыдущий Trident (MSHTML) компания прекратила развивать.

Риски

Использование стороннего движка порождает очевидные риски:

  1. Закрытие исходного кода
  2. Выход ключевых компаний из разработки
  3. Смена лицензий на код

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

Компании развивающие собственные браузеры должны понимать, что всё будет "хорошо" пока они не составляют угрозу/конкуренцию разработчикам оригинального браузера/браузерного движка. Думаю это очевидно. Компания тратит на разработку движка свои ресурсы, но вдруг появляется другая компания которая используя их движок захватывает рынок. Реакция, думаю, очевидна — смотрим список рисков выше.

«Мы создадим копию движка на текущий момент и продолжим развивать сами» — именно так отвечают производители браузеров на сторонних движках. Большое заблуждение, не выйдет просто так продолжить разработку чужого движка. То есть, взять программистов и поставить им задачу — пишите браузерный движок. Написание браузерного движка сложный технологический процесс. Подтверждением этого служит список их обладателей.

Для примера, компания Microsoft создает свой движок, хоть и закрытый. Google вместе с Apple разрабатывали WebKit, но позже Google сделал форк и начал развитие собственного движка Blink.

При этом нужно понимать, что браузерный движок постоянно развивается. Постоянно обновляются спецификации, добавляются новые возможности, улучшаются текущие. Это живая работа. Если взять какой-либо движок на текущую дату и просто использовать его для своего браузера то, примерно, через год-два браузер на этом движке морально устареет.

Адаптация движков

Существует проблема адаптации стороннего движка под нужды собственного браузера. На адаптацию тратится не мало ресурсов. При этом нужно понимать, что браузерные движки часто обновляются, что создает систематические проблемы при интеграции в собственный браузер.

Собственный движок

Прежде всего стоит ответить на главный вопрос — зачем создавать свой браузерный движок? А точнее, кому не надо создавать свой движок?

Свой браузерный движок не стоит создавать если:

  • Нет задачи/стремления захватить рынок.
  • Браузер нужен лишь номинально. Сейчас это модно, делают даже школьники.
  • Создаваемый движок не будет отличаться от существующих: скорость, надёжность, адаптивность.
  • Идёт освоение бюджета.

На текущий момент нет сложности создать собственный браузер на стороннем движке. Их наплодилось не мало и как-то выделиться среди всей этой массы можно только созданием браузера на исключительно своих компонентах, на собственном движке.

Стоит ли заниматься разработкой движка для "заработка", для создания стартапа?

Данный вопрос скорее к сфере его применения. Мне видится несколько направлений:

  1. Собственно, создание полноценного браузера. Сотрудничество с поисковыми системами, различными сервисами. Создание особых версий для государственных структур.
  2. Рынок IoT (интернет-вещей), а так же адаптация для телевизоров, приставок, портативных устройств.
  3. Сервисы на отдельных компонентах браузера. Например, умный анализ контента сайта на риски: запрещенные комментарии, посты от пользователей и так далее. Технический анализ сайтов.
  4. Продажа движка. Самое простое, написать под компанию.

Кроме того, престиж компании разработчика браузерного движка значительно выше чем у клонов. Именно как технологической компании. Это сказывается на популярности компании и привлекательности для существующих и будущих сотрудников. Но это уже скорее о честолюбии, встать в одном списке с такими компаниями как Google, Mozilla, Microsoft.

Заключение

Без сомнения, создание браузерного движка процесс сложный и требующий значительных ресурсов. Подходить к этой разработки необходимо крайне серьёзно и с чётким планом по развитию. Кроме того, это не тот продукт прибыль от которого можно получать на промежуточном этапе разработки. Да, отдельные компоненты можно адаптировать под нужды компаний, но я уверен, что такой подход только отнимет время и значительно затянет разработку.

Развитие браузерного движка сильно зависит от метода его разработки. Каким он будет: открытым, закрытым?

Я уверен, что если компания занимается развитием браузера на основе стороннего браузерного движка то ей следует серьёзно подумать над перспективой создания собственного.

Компании далёкой от браузеров заняться разработкой браузерного движка тоже можно, и не только для того чтобы создать браузер. Если итоговый продукт будет полноценным браузерным движком превосходящим существующие то он будет востребован. Сферы применения были описаны выше.

Цикл статей

  1. Браузер != Браузерный движок
  2. Браузерный движок. Архитектура, работа с памятью.
  3. HTML парсер. Токенизация, обработка токенов, построение дерева.
    Пишем свой парсер. Из каких стадий состоит разбор HTML, в чём сложность и как разогнать HTML парсер в несколько раз.
  4. Кодировки в HTML. Как определяются, как конвертируются.
    Напишем свой кодировщик и обсудим положение дел.
  5. CSS парсер и CSS модули. Токенизация, обработка токенов.
    Создадим свой CSS парсер. Разберём основные аспекты обработки CSS. Выясним в чём сложность, на что тратятся ресурсы и как написать самый быстрый парсер CSS/модулей.
  6. CSS парсер. Grammar.
    Пишем собственный Grammar для CSS модулей формирующий быстрый, человеко-читаемый код.
  7. CSS Selectors. Как устроены, быстрый поиск HTML элементов по селекторам.
  8. Layout. Скрещиваем HTML и CSS.
    Назначаем CSS свойства HTML элементам. Разберём порядок назначения, приоритеты и что делать если CSS постоянно изменяется.
  9. Layout. Потоки. Поддержка CSS свойства display: block.
  10. Шрифты. Как расчитывать размер символов, строк.
    Напишем свой парсер шрифтов. Узнаем, что такое baseline, descender, x-height, как хранятся символы и углубимся в тему расчётов размера символов.
  11. Layout. Поддержка CSS свойства display: inline.

Судьба Modest

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

К сожалению, проект Modest пришлось завершить. Какое-то время проект развивался в компании, в которой я раньше работал. Мне пришлось покинуть компанию. Появились разногласия которые не позволили продолжить разработку проекта. Обычный рабочий процесс, такое бывает.

Не смотря на то, что у меня есть все права на Modest, на код никто не претендует (подписаны бумаги), я решил его "закопать". Чтобы ни у кого не возникало ложных ощущений. Тут надо понимать, что закапывается и весь основной код который развивался вне компании (mycore, myhtml). Но, есть и плюс, возможно, я стал чуть умнее.

Мной было потрачено очень много времени на изучение спецификаций, осознания их, поиск оптимальных алгоритмов, написание черновиков (прототипов), создание myhtml (самый быстрый парсер html) в свободное от работы время, и просто так забросить эту тему я пока не могу. Было потрачено много выходных, праздников, вечеров, ночей.

Теперь я занимаюсь разработкой нового браузерного движка. Разработка с ноля. Имени у него пока нет, только кодовое — lexbor. Вся основа уже написана: работа с памятью, общие алгоритмы, заложена будущая архитектура. Как всегда, всё краше и лучше чем было. В общем, у меня есть самое главное: технология и чёткое видение/понимание как и что развивать.

Одному мне такой проект не потянуть. Если поддержки не найду (финансирования) то прекращу разработку и присоединюсь контребьютером к существующему открытому движку (Blink или Gecko). Попробую побыть там волонтером и реализовать свои идеи. Занимаюсь всем этим исключительно в нерабочее время.

Тут видимо должна быть картинка «ты должен был бороться со злом, а не примкнуть к нему».

Браузерный движок – это специальная программа, которая работает с веб-страницами. Он обрабатывает загруженную из интернета HTML-страницу, и преобразует ее код в привычное для пользователей представление. Движки интернет-браузеров используются в самих браузерах, а также в почтовых клиентах. Далеко не каждый веб-обозреватель создан на своей собственной уникальной платформе. Многие из них используют популярные и проверенные временем решения. В данной статье рассматривается, какие существуют платформы для создания браузеров, и чем они отличаются друг от друга.

Логотипы браузеров

Общие сведения

Использование движков (Rendering engine) для создания обозревателей имеет множество преимуществ:

  • Облегчается поиск и устранение ошибок кода.
  • Удобная возможность улучшить отдельный компонент сразу в нескольких программах.
  • Облегчается процесс изменения графического интерфейса приложения.
  • Простота создания новых программ под желания конкретного разработчика или нужны конкретного пользователя.

Подобные решения очень часто используются в программировании: при создании видеоигр, операционных систем сложных программ и так далее. Одни специалисты работают над совершенствованием и оптимизацией движка, внесением в него новых возможностей и полезных функций. Другие занимаются созданием самих программ на основе разработанной платформы.

Яркий пример – движок Trident от компании Microsoft. Он один используется в большом множестве приложений данной корпорации. Развивается основа – развиваются и производные проекты.

Каждое решением имеет свои плюсы и минусы. Например, многие пользователи замечают, что Mozilla Firefox гораздо лучше работает с большим количеством открытых вкладок, чем конкуренты. Это достижение платформы, на основе которой создан обозреватель.

Trident

Когда пользователь устанавливает новую операционную систему Windows, первый веб-обозреватель, с которым он сталкивается – это Internet Explorer. Поэтому его движок рассмотрен в обзоре первым.

Trident, или MSHTML – довольно старый программный компонент, разработанный корпорацией Microsoft для своих нужд. Проект непрерывно развивается с 1997 года. Используется в веб-обозревателе от Майкрософт – Internet Explorer, почтовом клиенте Outlook, Проводнике Виндовс (программа для работы с файлами) и множестве других приложений данного разработчика.

Пользователями считается одним из наиболее неудачных движков для браузеров. Не поддерживает сторонние модульные расширения – плагины, некорректно отображает многие интернет-страницы, имеет не самую быструю скорость работы.

С выходом Windows 10 платформа Trident эволюционировала в EdgeHTML.Разработчики взяли устаревший неудачный движок за основу и создали новую, отвечающий всем требованиям современным пользователей. Судя по проведенным бенчмаркам (программный тест производительности и скорости работы), Microsoft Edge (обозреватель, созданный на основе EdgeHTML) догнал и даже перегнал популярные программы, использованные для создания браузеров Google Chrome и Mozilla Firefox.

Gecko

Gecko – движок, используемый в популярном интернет-обозревателе Мозилла Фаерфокс и множестве других программ. Исходный код программы находится в свободном доступе, то есть каждый желающий может абсолютно бесплатно создать на основе Gecko свой собственный браузер или почтовый клиент.

Другое преимущество Геко – кроссплатформенность. Он работает на подавляющем большинстве современных операционных систем: как для персональных компьютеров, так и для мобильных устройств (в отличие от Internet Explorer, который функционирует только на ОС Windows).

Логотип обозревателя Mozilla Firefox

Gecko поддерживает все современные стандарты и технологии, используемые при создании вебсайтов. Является одной из двух наиболее популярных браузерных платформ. Поддерживает подключение плагинов. Бенчмарки и личный опыт пользователей показывают, что браузеры на данном движке потребляют меньше всего ресурсов персонального компьютера и стабильно работают с большим количеством вкладок (например, несколько сотен).

На основе Геко создан популярный интернет-обозреватель Mozilla Firefox, почтовый клиент Thunderbird, планировщик задач Sunbird, а также анонимный веб-браузер с встроенной поддержкой VPN-технологий Tor.

KHTML

Файловый менеджер Konqueror

WebKit

Этот движок разработан всемирно известной корпорацией Apple на основе вышеупомянутого решения – KHTML. Выпущенный в 2001 году, этот проект получил колоссальное развитие и стал одним из самых используемых в мире.

На основе WebKit был создан веб-обозреватель Safari, используемый по умолчанию в iOS-устройствах и лидер по известности среди браузеров – Google Chrome. Подавляющее число современных программ для обработки содержимого веб-страниц имеют в своей основе ВебКит. Кроме того, он используется в популярном приложении Steam, предназначенном для цифровой дистрибуции компьютерных игр от компании Valve.

Эмблема браузера Safari

Аналогично с Gecko, WebKit является кроссплатформенным и отлично запускается на всех популярных платформах. Показывает высокую стабильность и производительность работы. Ввиду огромной известности, под данное решение разрабатывается подавляющее большинство расширений. Также используется в популярных мобильных платформах, таких как Android и iOS. Является свободным движком, то есть может быть бесплатно использован любым человеком для создания собственных приложений.

Логотип движка Blink

Presto

Созданный в 2003 году, браузерный движок Presto использовался в качестве основы для Opera. Развивался на протяжении 10-ти лет. В 2013 разработчики Оперы решили отказаться от использования Presto в пользу более мощного и популярного Blink от Google. В данный момент развития проекта остановлено.

Читайте также: