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

Вид: 15907|Ответ: 2

CEF: Встраивайте Chrome для клиента

[Скопировать ссылку]
Опубликовано 22.09.2017 16:19:26 | | |
Что такое CEF?
CEF — это сокращение от Chromium Embedded Framework, который является открытым управлением веб-браузера, основанным на проекте Google Chromium, поддерживающим платформы Windows, Linux и Max. Помимо предоставления интерфейсов C/C++, существуют также порты для других языков.

Поскольку он основан на Chromium, CEF поддерживает функции HTML5, реализованные в Webkit и Chrome, и относительно близок к Chrome по производительности.

CEF также предоставляет следующие функции: пользовательские плагины, пользовательские протоколы, пользовательские объекты и расширения Javascrip; Контролируемая загрузка ресурсов, навигация, контекстные меню и так далее.

Кто использует CEF
Давайте возьмём несколько практических примеров, чтобы проиллюстрировать, что все сделали с CEF:

Различные браузеры

Ранние двухъядерные браузеры (IE + Webkit) некоторые использовали CEF в качестве управления браузером ядра Webkit.

Однако для браузеров расширение напрямую в Chrome — это на самом деле главное, и сейчас так делают все (разные быстрые браузеры).

Клиент Evernote (на Windows)

Evernote позволяет пользователям вставлять веб-страницы в заметки, а также предоставляет плагины для сохранения веб-страниц в виде заметок.

Это должна быть необходимость корректного рендеринга страницы на клиенте, и эта задача остаётся на усмотрение CEF.

Клиент GitHub (на Windows)

GitHub также включил libcef.dll, с точки зрения производительности, страница ReadMe, используемая для отображения проекта, должна быть CEF, а интерфейс в других местах также может частично реализоваться с помощью страниц.

QQ

QQ давно реализовала некоторые функции и интерфейсы, встроив IE. С прошлого года QQ представила CEF, заменив некоторые места, где раньше использовался IE, чтобы использовать новые функции на базе Webkit, а также получила преимущества в скорости, стабильности и совместимости.

Adobe Edge Animate и Adobe Edge Reflow

Adobe выпустила полный набор современных веб-страниц (или HTML5?) Эдж.

Adobe Edge Animate для анимации может создавать сложные анимации, редактируя временную шкалу и создавая оригиналы (в Edge Animate называемые символами).

Edge Reflow — это дизайн адаптивного веба. Некоторые переводят это как адаптивный, что на самом деле является адаптивным.

Два предыдущих ПО в первую очередь ориентированы на браузер ядра Webkit, поэтому необходимо встраивать ядро Webkit для обеспечения интерфейса предпросмотра и редактирования WYSIWYG. Все они использовали CEF. (Разница между CEF и чистым Webkit будет введена позже)

Q+

В рамках концепции веб-приложения Q+ предоставляет рабочую среду для веб-страниц (проще говоря: коробка с клиентом и некоторые доступные API), а также поддерживает ядра IE и Webkit.

Для студентов веб-разработки ядро Webkit (на самом деле CEF), которое мы представили, не требует учитывать проблемы совместимости версий IE, что не только повышает эффективность разработки, но и позволяет использовать некоторые новые возможности HTML5. В то время рынок приложений, центр сообщений, обои, музыкальные виджеты и другие приложения Q+ разрабатывались на базе ядра Webkit.

Можно сказать, что проект Q+ предпринял больше попыток создать CEF, например:

Разработанный музыкальный виджет использует аудиотег HTML5;

Некоторые приложения используют офлайн-функционал HTML5 (то есть с манифестом), но, конечно, бывают свои повороты, и я приобрёл много опыта.

Упакованные инструменты разработки Webkit.

Пользовательские протоколы: например, доступ к qplus:// протоколам можно перенаправить в специальную папку.

Внеэкранный рендеринг (OSR): с помощью рендеринга вне экрана + слоистого окна Windows создаётся неправильное окно веб-страницы (какова форма непрозрачной области веб-страницы, какова форма окна)

Зачем встраивать CEF для клиентов?
С таким количеством примеров этот вопрос гораздо проще ответить:

Он используется для отображения веб-страниц и использования различных веб-сервисов;

Используйте веб-страницы для создания интерфейса;

Используйте функции HTML5, такие как аудио, холст и т.д., включая функции CSS3.

Рендеринг вне экрана (OSR):

Так называемый OSR — это рендеринг всей страницы на растровой мапе без создания настоящего окна. Конечно, не только рендеринг, но и серия API для обработки событий мыши, клавиатуры, событий методов ввода и т.д.

Эта функция особенно полезна, когда реальные окна нельзя использовать, например, в слоистых окнах или при рендеринге текстур в играх.

Используя функции OSR, можно создать интересные эффекты, например:

AlloyTeam создала Webtop, который использует OSR для создания браузера, плеера и так далее.

Есть проект Awesomium, который также поддерживает OSR, и уже есть игровые проекты, использующие Awesomium для рендеринга веб-страниц в играх. (Смотря на выходной файл Awesomium, он должен быть похож на реализацию CEF, это всё пакет Chromium, и CEF, который Awesomium может сделать, тоже нужно реализовать)

В свободное время я сделал демо и использовал CEF для рендеринга веб-страниц на OpenGL Texture, что можно рассматривать как небольшую попытку применить CEF к игре, как показано на рисунке:

Внутриигровое демо браузера

Почему CEF?
То есть

IE уже давно является встроенным управлением браузера, и, если быть точным, теперь у нас есть множество альтернатив IE.

CEF против IE:

Совместимость:

IE: Ядро варьируется от 6 до 10 версий в зависимости от операционной системы, и нагрузка на веб-разработку для совместимости с этими версиями нельзя недооценивать.

CEF: Используется ядро Webkit, и с точки зрения характеристик версия CEF может соответствовать номеру версии Chrome, чтобы веб-разработка имела чёткий набор функций и устраняет нагрузку по совместимости.

Стандарты и новые функции HTML5:

IE: Конечно, старые версии IE не поддерживают последние HTML-функции и стандарты.

CEF: Нет сомнений, что Webkit и Chrome находятся в авангарде поддержки новых функций.

Открытый исходный код и кроссплатформенность:

IE: Не открытый исходный код, ограничен платформой Windows

CEF: Открытый исходный код, используемые Webkit и Chromium — все с открытым исходным кодом, открытый исходный код означает больше настраиваемых возможностей; И она охватывает Windows, Mac и Linux.

Визуализация за кадром (OSR):

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

CEF: Есть отдельный режим рендеринга вне экрана и соответствующий API.

Проникновение:

IE: У всех пользователей Windows есть IE, что является преимуществом IE (но у некоторых пользователей неправильные настройки IE, что приведёт к неудобству, например, jscrip{filtering}t.dll не зарегистрировано, что приводит к невозможности использовать Javascrip{filter}t)

CEF: Её нужно установить и упаковать самостоятельно

Webkit

Зачем сознательно сравнивать CEF и Webkit?

Недавно я прочитал хорошую статью о том, что такое Webkit, чем он не является и почему существует так много портов Webkit: «Что разработчикам нужно знать о WebKit»

Вот приблизительное резюме:

Webkit — это движок разбора и организации веб-страниц, который используется всеми браузерами на базе Webkit. Порт Webkit по умолчанию — Safari, это версия, скачанная из компиляции исходного кода Webkit. Существуют и другие порты Webkit, включая Chromium, QtWebkit и другие, которые имеют разные реализации в 2D-графике, ускорении GPU, движке Javascrip, декодировании аудио/видео и т.д.

CEF против вебкита (на самом деле Chromium против Webkit)

V8-движок, 2D-рендеринг от Skia, реализация с ускорением GPU от Chromium и т.д., благодаря отличной реализации Chromium, CEF также стал отличным портом Webkit.

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

Том:

В последней версии CEF сумма всех DLL должна быть близка к 40M, а после сжатия оценивается 10M+. Если ваш проект сам по размеру невелик и не может его принять, то CEF вам не подходит.

Конечно, для игр, которые теперь рассчитываются по G, этот объём всё ещё должен быть приемлемым.

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

Кэш:

Кэш Chrome спроектирован так, чтобы читать и записывать только один процесс, и то же самое касается CEF.

Для клиентов, которые нужно открывать несколько раз, для каждого экземпляра процесса может быть указана только отдельная папка кэша. Однако это, несомненно, увеличивает использование жёсткого диска и приводит к тому, что некоторые файлы, которые изначально кэшировались, загружаются несколько раз (например, процесс A кэширует jQuery.js, процесс B должен запросить и кэшировать один раз, потому что кэширует разные каталоги jQueyr.js

OSR:

В настоящее время OSR отличается от режима real window, который можно ускорить с помощью GPU, а OSR можно рендерить только с помощью программного обеспечения, что означает, что некоторые 3D-эффекты CSS не поддерживаются.

Тем не менее, характеристики OSR всё ещё улучшаются, и лично я считаю, что его стоит ждать с нетерпением.

Что поделиться позже
После стольких написанных текстов это можно рассматривать как введение в CEF, и я в будущем напишу несколько сухих материалов, а именно — как использовать CEF, включая:

Сбор кода CEF, компиляция, встраивание, обработка API-вызовов страниц и клиентов, OSR-рендеринг вне экрана, кэширование, пользовательские протоколы, CEF1 и CEF3 и т.д.

Ну, на сегодня всё.





Предыдущий:Redis настраивает удалённое подключение и пароли доступа
Следующий:ASP.NET нескольких запросов на странице одновременно возникает ситуация блокировки приостановленной анимации
Опубликовано 25.02.2019 9:14:24 |
Прекрасно
 Хозяин| Опубликовано 12.08.2023 20:08:02 |
WebView2 (6) Распространение и развертывание среды выполнения WebView2
https://www.itsvse.com/thread-10372-1-1.html

[WebView2] (5) Загрузка локальных HTML-ресурсов виртуального хоста
https://www.itsvse.com/thread-10367-1-1.html

[WebView2] (4) Методы функции вызова Web и WinForm друг к другу
https://www.itsvse.com/thread-10365-1-1.html

WebView2 (3) Двунаправленная коммуникация между вебом и приложениями WinForm
https://www.itsvse.com/thread-10364-1-1.html

[WebView2] (2) WinForm вводит WebView2 для отображения веб-контента
https://www.itsvse.com/thread-10362-1-1.html

[WebView2] (1) Первое знакомство с технологией Microsoft Edge WebView2
https://www.itsvse.com/thread-10361-1-1.html
Отказ:
Всё программное обеспечение, программные материалы или статьи, публикуемые Code Farmer Network, предназначены исключительно для учебных и исследовательских целей; Вышеуказанный контент не должен использоваться в коммерческих или незаконных целях, иначе пользователи несут все последствия. Информация на этом сайте взята из Интернета, и споры по авторским правам не имеют отношения к этому сайту. Вы должны полностью удалить вышеуказанный контент с компьютера в течение 24 часов после загрузки. Если вам нравится программа, пожалуйста, поддержите подлинное программное обеспечение, купите регистрацию и получите лучшие подлинные услуги. Если есть нарушение, пожалуйста, свяжитесь с нами по электронной почте.

Mail To:help@itsvse.com