Qu’est-ce que la CEF ?
CEF est l’abréviation de Chromium Embedded Framework, un système de contrôle de navigateur web open source basé sur le projet Google Chromium, prenant en charge les plateformes Windows, Linux et Max. En plus de fournir des interfaces C/C++, il existe également des ports pour d’autres langages.
Parce qu’il est basé sur Chromium, CEF prend en charge les fonctionnalités HTML5 implémentées dans Webkit et Chrome, et est relativement proche de Chrome en termes de performances.
CEF propose également les fonctionnalités suivantes : plugins personnalisés, protocoles personnalisés, objets Javascrip personnalisés et extensions ; Chargement de ressources contrôlables, navigation, menus contextuels, etc.
Qui utilise CEF
Prenons quelques exemples pratiques pour illustrer ce que chacun a fait avec la CEF :
Divers navigateurs
Les premiers navigateurs à double cœur (IE + Webkit), certains utilisaient le CEF comme contrôle du navigateur du noyau Webkit.
Cependant, pour les navigateurs, étendre directement sur Chrome est en fait le roi, et tout le monde le fait maintenant (divers navigateurs rapides).
Client Evernote (sous Windows)
Evernote permet aux utilisateurs de coller des pages web dans des notes, et propose également des plugins pour sauvegarder des pages web sous forme de notes.
Cela doit être la nécessité de rendre correctement la page sur le client, et cette tâche est laissée à CEF.
Client GitHub (sous Windows)
GitHub a également intégré libcef.dll, du point de vue des performances, la page ReadMe utilisée pour afficher le projet doit être CEF, et l’interface utilisateur ailleurs peut aussi être partiellement implémentée avec des pages.
QQ
QQ a mis en œuvre certaines fonctions et interfaces en intégrant IE il y a longtemps. Depuis l’année dernière, QQ a introduit CEF, remplaçant certains établissements qui utilisaient auparavant IE, permettant ainsi de bénéficier de nouvelles fonctionnalités basées sur Webkit, et en même temps, elle a gagné des avantages en termes de vitesse, de stabilité et de compatibilité.
Adobe Edge Animate & Adobe Edge Reflow
Adobe a lancé un ensemble complet de pages web modernes (ou HTML5 ?) Edge.
Adobe Edge Animate, pour l’animation, peut réaliser des animations complexes en modifiant la timeline et en créant des originaux (appelés symboles dans Edge Animate).
Edge Reflow est le design du web réactif. Certaines personnes le traduisent par réactif, ce qui est en réalité adaptatif.
Les deux logiciels ci-dessus sont essentiellement orientés vers le navigateur du noyau Webkit, il est donc nécessaire d’intégrer un noyau Webkit pour fournir une interface d’aperçu et d’édition WYSIWYG. Ils ont tous utilisé le CEF. (La différence entre CEF et Webkit pur sera introduite plus tard)
Q+
Dans le concept d’application Web, Q+ fournit un environnement d’exécution pour les pages web (en termes simples : une boîte du client et certaines API disponibles), et prend en charge les noyaux IE et Webkit.
Pour les étudiants en développement web, le noyau Webkit (en fait CEF) que nous avons introduit n’a pas besoin de prendre en compte les problèmes de compatibilité des versions d’IE, ce qui améliore non seulement l’efficacité du développement, mais nous permet aussi de profiter de certaines nouvelles fonctionnalités HTML5. À cette époque, le marché des applications de Q+, le centre de messages, les fonds d’écran, les widgets musicaux et d’autres applications étaient tous développés à partir du noyau Webkit.
On peut dire que le projet Q+ a fait davantage de tentatives de CEF, telles que :
Le widget musique développé utilise la balise audio HTML5 ;
Certaines applications utilisent la fonctionnalité hors ligne de HTML5 (c’est-à-dire avec un fichier manifest), mais bien sûr il y a quelques rebondissements, et j’ai acquis beaucoup d’expérience.
Outils de développement Webkit fournis.
Protocoles personnalisés : Par exemple, l’accès à qplus:// protocoles peut être redirigé vers un dossier spécial.
Rendu hors écran (OSR) : En utilisant le rendu hors écran + fenêtre superposée Windows, une fenêtre de page web irrégulière est créée (quelle est la forme de la zone opaque de la page web, quelle est la forme de la fenêtre)
Pourquoi intégrer le CEF pour les clients ?
Avec autant d’exemples, cette question est bien plus facile à formuler :
Il est utilisé pour afficher des pages web et utiliser divers services Web ;
Utilisez des pages web pour faire de l’interface utilisateur ;
Utilisez des fonctionnalités HTML5, telles que l’audio, le canvas, etc., y compris les fonctionnalités CSS3.
Rendu hors écran (OSR) :
Le soi-disant OSR consiste à afficher toute la page sur un bitmap sans créer de véritable fenêtre. Bien sûr, non seulement le rendu, mais aussi une série d’API pour gérer les événements de souris, clavier, événements de méthode d’entrée, etc.
Cette fonctionnalité est particulièrement utile lorsque de vraies fenêtres ne peuvent pas être utilisées, comme sur les fenêtres en couches, ou lorsqu’elles sont rendues sur des textures dans des jeux.
Grâce aux fonctionnalités OSR, certains effets intéressants peuvent être réalisés, tels que :
AlloyTeam a créé Webtop, qui utilise OSR pour créer un navigateur, un lecteur, etc.
Il existe un projet Awesomium qui prend aussi en charge OSR, et il existe déjà des projets de jeux qui utilisent Awesomium pour afficher des pages web dans les jeux. (En regardant le fichier de sortie d’Awesomium, il devrait être similaire à l’implémentation de CEF, tout est un package de Chromium, et CEF qu’Awesomium peut faire devrait aussi être fait)
Pendant mon temps libre, j’ai fait une démo et utilisé CEF pour afficher des pages web sur OpenGL Texture, ce qui peut être considéré comme une petite tentative d’appliquer CEF au jeu, comme montré sur la figure :
Démo du navigateur en jeu
Pourquoi le CEF ?
C’est-à-dire
IE est un contrôle intégré du navigateur depuis longtemps, et pour être précis, nous avons désormais de nombreuses alternatives à IE.
CEF vs IE :
Compatibilité:
Par exemple : Le noyau varie de 6 à 10 versions selon le système d’exploitation, et la charge de travail du développement web pour être compatible avec ces versions ne peut être sous-estimée.
CEF : Il utilise le noyau Webkit, et du point de vue des caractéristiques, une version CEF peut correspondre à un numéro de version Chrome, de sorte que le développement web dispose d’un ensemble clair de fonctionnalités, éliminant ainsi la charge de travail liée à la compatibilité.
Standard HTML5 & Nouvelles fonctionnalités :
IE : Bien sûr, les versions plus anciennes d’IE ne prennent pas en charge les dernières fonctionnalités et standards HTML.
CEF : Il ne fait aucun doute que Webkit et Chrome sont à la pointe du support des nouvelles fonctionnalités.
Open Source & Multiplateforme :
C’est-à-dire : Non open source, limité à la plateforme Windows
CEF : Open source, le Webkit et Chromium utilisés sont tous open source, open source signifie plus de possibilités personnalisables ; Et cela couvre Windows, Mac et Linux.
Rendu hors écran (OSR) :
Par exemple : Vous pouvez obtenir un rendu hors écran grâce à quelques hacks, mais la charge de travail n’est pas faible, et ce n’est pas officiellement pris en charge.
CEF : Il existe un mode de rendu hors écran dédié et une API correspondante.
Pénétration :
IE : Tous les utilisateurs Windows ont IE, ce qui est l’avantage d’IE (mais certains utilisateurs ont des paramètres IE incorrects, ce qui rend inutilisable, comme jscrip{filtering}t.dll non enregistré, ce qui rend impossible d’utiliser Javascrip{filter}t)
CEF : Il faut l’installer et l’installer soi-même
Webkit
Pourquoi comparer délibérément CEF et Webkit ?
J’ai récemment lu un bon article sur ce qu’est Webkit, ce qu’il n’est pas, et pourquoi il existe autant de portages Webkit : « Ce que les développeurs doivent savoir sur WebKit »
Voici un résumé sommaire :
Webkit est le moteur d’analyse et d’arrangement des pages web, partagé par tous les navigateurs basés sur Webkit. Le portage par défaut de Webkit est Safari, qui est la version téléchargée à partir de la compilation du code source Webkit. Il existe d’autres ports Webkit, notamment Chromium, QtWebkit, etc., qui ont différentes implémentations en graphismes 2D, accélération GPU, moteur Javascrip, décodage audio/vidéo, etc.
CEF vs webkit (en réalité Chromium vs Webkit)
Le moteur V8, le rendu 2D de skia, l’implémentation accélérée GPU de Chromium, etc., grâce à l’excellente implémentation de Chromium, CEF est également devenu un excellent portage Webkit.
Inconvénients du CEF :
Soyez indulgent, la CEF a aussi ses propres limites et défauts, et vous ne pouvez pas simplement mentionner les avantages ; ici, je vais présenter les inconvénients et les inconvénients de la CEF :
Volume :
La dernière version de CEF, la somme de toutes les DLL devrait être proche de 40M, et on estime qu’elle sera de 10M+ après compression. Si votre projet lui-même n’est pas de grande taille et ne peut pas le recevoir, alors le CEF n’est pas fait pour vous.
Bien sûr, pour les jeux désormais calculés par G, ce volume devrait rester acceptable.
Pour les projets clients ordinaires, cela dépend si le projet lui-même doit utiliser les fonctionnalités implémentées par CEF, et s’il vaut la peine d’augmenter considérablement le package d’installation du produit. Bien sûr, il y a aussi quelques compromis d’implémentation ici, comme le téléchargement après installation (personnellement, je ne pense pas que cela soit significatif, après tout, les utilisateurs qui installent des packages peuvent aussi choisir de télécharger un logiciel pour accélérer)
Cache :
Le cache de Chrome est conçu pour ne recevoir qu’un seul processus en lecture et écriture, et il en va de même pour CEF.
Pour les clients qui doivent être ouverts plusieurs fois, seul un dossier cache différent peut être spécifié pour chaque instance de processus. Cependant, cela augmente sans aucun doute l’utilisation du disque dur, et provoque également le téléchargement de plusieurs fois de certains fichiers initialement mis en cache (par exemple, le processus A met en cache jQuery.js, le processus B doit demander et mettre en cache une fois car il met en cache différents répertoires jQueyr.js
OSR :
L’OSR n’est actuellement pas comme le mode fenêtre réelle, qui peut être accéléré par GPU, et l’OSR ne peut être rendu qu’avec des logiciels, ce qui signifie que certains effets CSS 3D ne peuvent pas être pris en charge.
Cependant, les caractéristiques de l’OSR continuent d’être améliorées, et personnellement je pense que cela mérite toujours d’être attendu avec impatience.
Que partager plus tard
Après avoir tant écrit, cela peut être considéré comme une introduction à la CEF, et j’écrirai à l’avenir quelques articles secs, à savoir comment utiliser la CEF, notamment :
Acquisition de code CEF, compilation, intégration, traitement des appels API de pages et clients, rendu OSR hors écran, mise en cache, protocoles personnalisés, CEF1 & CEF3, etc.
Bon, c’est tout pour aujourd’hui.
|
Publié sur 22/09/2017 16:19:26
|
|
|
Publié sur 25/02/2019 09:14:24
|
Propriétaire|
Publié sur 12/08/2023 20:08:02
|
