Демистификация электронной архитектуры

Electron внешний фреймворк
Демистификация электронной архитектуры

"Видимость: 🌟🌟🌟🌟🌟"

"Вкус: пряный живот"

"Время приготовления: 10 мин."

Эта статья была включена в переднюю столовую одноименного репозитория Github.github.com/Geekhyt, Добро пожаловать в кафетерий. Если вы считаете, что еда и вино вкусные, Звезда станет отличным поощрением для владельца кафетерия.

пасхальные яйца

Когда я вчера вечером вернулся домой, я увидел, что Питер опубликовал список друзей, была выпущена общедоступная бета-версия облачной игровой платформы Tencent START, и он играл в LOL с MAC. Прошёлся по ней и испытал волну.Ведь ЛОЛ это молодёжь нашего поколения.Времени поиграть после работы очень мало.После использования МАК,предыдущие геймбуки давно лежат на дне коробки .

Выберите волну EZ ~ (талант не успел измениться)

Первую победу я легко одержал за 20 минут (ведь я старый игрок в с2, и матчмейкинг работает штатно).Общее впечатление пока очень хорошее.Задержек по скорости домашней сети в принципе нет, разве что мышь немного неудобна при настройке угла обзора в оконном режиме. (Студенты, которые хотят получить опыт, не забудьте сначала отключить угол спускового крючка)

"Облачная" модель облачной игровой платформы полностью освобождает воображение от "кроссплатформенности". Возможно ли, что с появлением 5G она может стать лучшим решением для кроссплатформенных решений в будущем? Какие новые вызовы ждут нас, фронтенд-инженеров? Приглашаем студентов оставить сообщение для обсуждения ~

Книга вернулась к оригиналу.В последнее время я работаю над проектом Электрон.Электрон приложил много усилий для достижения кроссплатформенности. (Его можно сравнить с моделью облачной игровой платформы.) Давайте посмотрим.

Архитектура браузера Evolution

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

возьми нашу любимуюChromeНапример, от однопроцессорной архитектуры до 2007 г. до современной многопроцессорной архитектуры браузеры Станьте более стабильным, плавным и безопасным. Последнее, что вы можете увидетьChromeБраузер должен включать следующие процессы:

  • 1 个浏览器(Browser)主进程
  • 1 个 GPU 进程
  • 1 个网络(NetWork)进程
  • 多个渲染进程 (运行在沙箱模式下)
  • 多个插件进程

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

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

"Выбор делают только дети, хочу и рыбку, и медвежью лапу!"

Chrome 团队在 2016 年使用“面向服务的架构”(Services Oriented Architecture,简称 SOA)的思想设计了新的 Chrome 架构。

ChromeКоманда рефакторит модули в независимые сервисы (Service), служба работает в отдельном процессе, если вы хотите получить к ней доступ, вы должны использовать определенный интерфейс черезIPCобщаться. Такая архитектура, несомненно, более сплоченная, слабосвязанная, ее легче поддерживать и расширять.

Хромовая архитектура

ChromiumдаChromeВерсия с открытым исходным кодом также является браузером.

  • основной процессRenderProcessHostи рендерераRenderProcessОсобый уходIPCмероприятие.
  • процесс рендерингаRenderView: Наша страница находится здесьWebkitВерстка показать.
  • ResourceDispatcherОбрабатывать запросы ресурсов, когда странице необходимо запрашивать ресурсы, передаватьResourceDispatcher, создать запросIDвперед кIPC,существуетBrowserОбработать и вернуть.

Электронная архитектура

  • раскрывается в каждом процессеNative API (Main Native API、Renderer Native API)
  • представлятьNode.js

Таким образом, вElectronможно использовать вChromiumа такжеNode.jsСделай что-нибудь веселое!

А между тем предстоит решить трудность: какNode.jsа такжеChromiumsинтеграция?

Node.jsЦикл событий основан наlibuv,ноChromiumна основеmessage_pump.

Есть два основных пути решения этой проблемы:

  • 1. будетChromiumР ГNode.js:использоватьlibuvвыполнитьmessage_pump.
  • 2. будетNode.jsР ГChromium.

Первая программа,NW.jsВот что он делает.ElectronЯ тоже пробовал этот способ на ранней стадии, и оказалось, что это проще реализовать в процессе рендеринга, но очень хлопотно в основном процессе, т.к.GUIреализация разная,MacдаNSRunLoop,Linuxдаglib, не только объем инженерных работ очень велик, но и с некоторыми граничными условиями очень трудно справиться.

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

до позжеlibuvпредставилbackend_fdконцепция, эквивалентнаяlibuvФайловой дескриптор для избирательных событий, так чтоbackend_fdполучитьlibuvновое событие. То есть второй способ мышленияNode.jsР ГChromium.

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

резюме

БудуNode.jsР ГChromiumПринцип:

ElectronНачать новый безопасный поток для опросаbackend_fd,когдаNode.jsПосле того, как новый инцидент, пройтиPostTaskвперед кChromiumв цикле событий это достигаетElectronслияние событий.

Ссылаться на

  • «Принцип работы и практика браузеров» Ли Бин
  • «Практика разработки электронов» Дэн Яолун

❤️Любовное тройное комбо

1. Если вы считаете, что еда и напитки в столовой все еще аппетитны, просто поставьте лайк и поддержите это, ваше"отличный"моя самая большая мотивация.

2. Обратите внимание на фронтальную столовую официального аккаунта,"Ешьте каждый прием пищи!"

3. Нравится, комментирует, пересылает === призывает больше!