Dit artikel is een spiegelartikel van machinevertaling, klik hier om naar het oorspronkelijke artikel te gaan.

Bekijken: 15907|Antwoord: 2

CEF: Embed een Chrome voor de client

[Link kopiëren]
Geplaatst op 22-09-2017 16:19:26 | | |
Wat is CEF?
CEF is een afkorting voor Chromium Embedded Framework, een open-source webbrowserbesturing gebaseerd op het Google Chromium-project, die Windows-, Linux- en Max-platforms ondersteunt. Naast het bieden van C/C++-interfaces zijn er ook poorten voor andere talen.

Omdat het gebaseerd is op Chromium, ondersteunt CEF de HTML5-functies die in Webkit en Chrome zijn geïmplementeerd, en ligt het qua prestaties relatief dicht bij Chrome.

CEF biedt ook de volgende functies: aangepaste plugins, aangepaste protocollen, aangepaste Javascrip-objecten en extensies; Beheerbaar resource laden, navigatie, contextmenu's, enzovoort.

Wie gebruikt CEF
Laten we enkele praktische voorbeelden gebruiken om te illustreren wat iedereen met CEF heeft gedaan:

Verschillende browsers

Vroege dual-core browsers (IE + Webkit), sommige gebruikten CEF als een Webkit-kernelbrowserbesturing.

Voor browsers is het echter direct uitbreiden in Chrome echt de koning, en iedereen doet dat nu (verschillende snelle browsers).

Evernote Client (op Windows)

Evernote stelt gebruikers in staat webpagina's in notities te plakken en biedt ook plugins om webpagina's als notities op te slaan.

Dat moet de noodzaak zijn om de pagina correct op de client te renderen, en deze taak wordt aan CEF overgelaten.

GitHub-client (op Windows)

GitHub heeft ook libcef.dll verpakt heeft, qua prestatie, de ReadMe-pagina die wordt gebruikt om het project weer te geven CEF moet zijn, en de gebruikersinterface elders kan ook gedeeltelijk met pagina's worden geïmplementeerd.

QQ

QQ heeft al lang geleden enkele functies en interfaces geïmplementeerd door IE in te embedden. Sinds vorig jaar heeft QQ CEF geïntroduceerd, waarbij het enkele plaatsen vervangt die eerder IE gebruikten, zodat nieuwe functies gebaseerd op Webkit kunnen worden gebruikt, en tegelijkertijd heeft het voordelen gekregen op het gebied van snelheid, stabiliteit en compatibiliteit.

Adobe Edge Animate & Adobe Edge Reflow

Adobe heeft een complete set moderne webpagina's (of HTML5?) gelanceerd. Edge.

Adobe Edge Animate kan voor animatie complexe animaties bereiken door de tijdlijn te bewerken en originelen te maken (symbolen genoemd in Edge Animate).

Edge Reflow is het ontwerp van het responsieve web. Sommige mensen vertalen het als responsief, wat eigenlijk adaptief is.

De bovenstaande twee software is in wezen gericht op de browser van de Webkit-kernel, dus het is noodzakelijk om een Webkit-kernel in te betten om een WYSIWYG-preview- en bewerkingsinterface te bieden. Ze gebruikten allemaal CEF. (Het verschil tussen CEF en pure Webkit wordt later geïntroduceerd)

Q+

Onder het concept van Web App biedt Q+ een loopomgeving voor webpagina's (simpel gezegd: een venster van de client en enkele beschikbare API's) en ondersteunt het IE- en Webkit-kernels.

Voor webontwikkelingsstudenten hoeft de Webkit-kernel (eigenlijk CEF) die we introduceerden geen rekening te houden met de compatibiliteitsproblemen van IE, wat niet alleen de ontwikkelefficiëntie verbetert, maar ons ook in staat stelt om gebruik te maken van enkele nieuwe HTML5-functies. In die tijd werden de applicatiemarkt, het berichtencentrum, wallpapers, muziekwidgets en andere applicaties van Q+ allemaal ontwikkeld op basis van de Webkit-kernel.

Het Q+-project kan worden gezegd meer pogingen te hebben gedaan met CEF, zoals:

De ontwikkelde muziekwidget gebruikt de HTML5-audiotag;

Sommige applicaties gebruiken de offline functionaliteit van HTML5 (dus met een manifestbestand), maar natuurlijk zijn er ook wat wendingen en ik heb veel ervaring opgedaan.

Verpakte Webkit Dev Tools.

Aangepaste protocollen: Zo kan toegang tot qplus:// protocollen worden doorgestuurd naar een speciale map.

Off-screen rendering (OSR): Door off-screen rendering + Windows Layered Window te gebruiken, wordt een onregelmatig webpaginavenster gecreëerd (wat is de vorm van het ondoorzichtige gebied van de webpagina, wat is de vorm van het venster)

Waarom CEF inbedden voor klanten?
Met zoveel voorbeelden is deze vraag veel makkelijker te stellen:

Het wordt gebruikt om webpagina's weer te geven en gebruik te maken van diverse webdiensten;

Gebruik webpagina's om UI te doen;

Gebruik HTML5-functies, zoals audio, canvas, enzovoort, inclusief CSS3-functies.

Off-screen rendering (OSR):

De zogenaamde OSR is bedoeld om de hele pagina op een bitmap te renderen zonder een echt venster te creëren. Natuurlijk niet alleen rendering, maar ook een reeks API's om muis-, toetsenbordgebeurtenissen, invoermethoden, enzovoort te verwerken.

Deze functie is vooral nuttig wanneer echte vensters niet gebruikt kunnen worden, zoals bij gelaagde vensters, of wanneer ze in games naar texturen worden gerenderd.

Met behulp van OSR-functies kunnen enkele interessante effecten worden gemaakt, zoals:

AlloyTeam maakte Webtop, dat OSR gebruikt om een browser, speler, enzovoort te maken.

Er is een Awesomium-project dat ook OSR ondersteunt, en er zijn al gameprojecten die Awesomium gebruiken om webpagina's in games te renderen. (Als je naar het uitvoerbestand van Awesomium kijkt, zou het vergelijkbaar moeten zijn met de implementatie van CEF, het is allemaal een pakket van Chromium, en CEF dat Awesomium kan doen moet ook worden gedaan.)

In mijn vrije tijd maakte ik een demo en gebruikte CEF om webpagina's te renderen op OpenGL Texture, wat kan worden gezien als een kleine poging om CEF op het spel toe te passen, zoals te zien is in de figuur:

In-game browserdemo

Waarom CEF?
IE

IE is al lange tijd een ingebouwde browsercontrole, en om precies te zijn, hebben we nu veel alternatieven voor IE.

CEF versus IE:

Compatibiliteit:

Bijvoorbeeld: De kernel varieert van 6 tot 10 versies, afhankelijk van het besturingssysteem, en de werklast van webontwikkeling om compatibel te zijn met deze versies mag niet worden onderschat.

CEF: Het gebruikt de Webkit-kernel, en vanuit het oogpunt van kenmerken kan een CEF-versie overeenkomen met een Chrome-versienummer, zodat webontwikkeling een duidelijke set functies heeft en het werk van compatibiliteit elimineert.

HTML5-standaard & Nieuwe Functies:

IE: Natuurlijk ondersteunen oudere versies van IE niet de nieuwste HTML-functies en -standaarden.

CEF: Er bestaat geen twijfel over dat Webkit en Chrome vooroplopen in het ondersteunen van nieuwe functies.

Open Source & Cross-Platform:

Bijvoorbeeld: niet open source, beperkt tot het Windows-platform

CEF: Open source, de gebruikte Webkit en Chromium zijn allemaal open source, open source betekent meer aanpasbare mogelijkheden; En het omvat Windows, Mac en Linux.

Off-screen rendering (OSR):

Bijvoorbeeld: Je kunt off-screen renderen met sommige hacks, maar de werklast is niet klein en het wordt niet officieel ondersteund.

CEF: Er is een speciale off-screen rendermodus en bijbehorende API.

Penetratie:

IE: Alle Windows-gebruikers hebben IE, wat het voordeel is van IE (maar sommige gebruikers hebben verkeerde IE-instellingen, wat leidt tot onbruikbaarheid, zoals jscrip{filtering}t.dll niet geregistreerd, waardoor Javascrip{filter}t niet meer kan worden gebruikt)

CEF: Je moet het zelf installeren en verpakken

Webkit

Waarom zou je CEF en Webkit expres vergelijken?

Ik las onlangs een goed artikel over wat Webkit is, wat het niet is, en waarom er zoveel Webkit-ports zijn: "Wat ontwikkelaars moeten weten over WebKit"

Hier is een ruwe samenvatting:

Webkit is de parsing- en arrangementsengine voor webpagina's, die gedeeld wordt door alle Webkit-gebaseerde browsers. De standaard Webkit-port is Safari, de versie die is gedownload van de Webkit-broncodecompilatie. Er zijn ook andere Webkit-poorten, waaronder Chromium, QtWebkit, enzovoort, die verschillende implementaties hebben in 2D-graphics, GPU-versnelling, Javascrip-engine, audio/video-decoding, enzovoort.

CEF vs webkit (eigenlijk Chromium vs Webkit)

V8-engine, skia's 2D-rendering, Chromium's GPU-versnelde implementatie, enzovoort, met behulp van Chromiums uitstekende implementatie, is CEF ook een uitstekende Webkit-port geworden.

CEF Nadelen:
Wees vriendelijk, CEF heeft ook zijn eigen tekortkomingen en beperkingen, en je kunt niet alleen de voordelen noemen, hier zal ik de na- en nadelen van CEF introduceren:

Volume:

Bij de nieuwste versie van CEF zou de som van alle DLL's dicht bij 40 miljoen moeten liggen, en wordt geschat dat het na compressie 10 miljoen zal zijn. Als je project zelf niet groot is en het niet kan ontvangen, dan is CEF niets voor jou.

Natuurlijk zou dit volume voor spellen die nu door G worden berekend, nog steeds acceptabel moeten zijn.

Voor gewone clientprojecten hangt het ervan af of het project zelf gebruikmaakt van de door CEF geïmplementeerde functies, en of het de moeite waard is om het installatiepakket van het product zo veel uit te breiden. Natuurlijk zijn er hier ook enkele implementatiecompromisen, zoals downloaden na installatie (persoonlijk vind ik dit niet zinvol, want gebruikers die pakketten installeren kunnen er ook voor kiezen software te downloaden om te versnellen).

Cache:

De cache van Chrome is ontworpen om slechts één proces te laten lezen en schrijven, en hetzelfde geldt voor CEF.

Voor clients die meerdere keren geopend moeten worden, kan per procesinstantie slechts een andere cachemap worden opgegeven. Dit verhoogt echter ongetwijfeld het gebruik van de harde schijf, en zorgt er ook voor dat sommige bestanden die oorspronkelijk gecachet waren, meerdere keren worden gedownload (bijvoorbeeld proces A cachet jQuery.js, proces B moet één keer opvragen en cachen omdat het verschillende mappen jQueyr.js

OSR:

OSR is momenteel niet zoals real window-modus, die versneld kan worden door de GPU, en OSR kan alleen met software worden gerenderd, wat betekent dat sommige CSS 3D-effecten niet worden ondersteund.

Toch worden de eigenschappen van OSR nog steeds verbeterd, en persoonlijk vind ik het nog steeds de moeite waard om naar uit te kijken.

Wat je later kunt delen
Na zoveel te hebben geschreven, kan het worden beschouwd als een introductie tot CEF, en ik zal in de toekomst nog wat droge artikelen schrijven, namelijk hoe CEF te gebruiken, waaronder:

CEF-code acquisitie, compilatie, embedding, verwerking van API-aanroepen van pagina's en clients, OSR off-screen rendering, caching, aangepaste protocollen, CEF1 en CEF3, enzovoort.

Nou, dat was het voor vandaag.





Vorig:Redis stelt externe verbinding en toegangswachtwoorden in
Volgend:ASP.NET meerdere verzoeken tegelijk op de pagina zijn, is er sprake van een blokkerende suspensie
Geplaatst op 25-02-2019 09:14:24 |
Geweldig
 Huisbaas| Geplaatst op 12-08-2023 20:08:02 |
WebView2 (6) Verspreid en deploy de WebView2-runtime
https://www.itsvse.com/thread-10372-1-1.html

[WebView2] (5) Lokale HTML-bronnen van de virtuele host laden
https://www.itsvse.com/thread-10367-1-1.html

[WebView2] (4) Web- en WinForm-functiemethoden roepen elkaar aan
https://www.itsvse.com/thread-10365-1-1.html

WebView2 (3) Bidirectionele communicatie tussen de web- en WinForm-applicaties
https://www.itsvse.com/thread-10364-1-1.html

[WebView2] (2) WinForm introduceert WebView2 om webinhoud weer te geven
https://www.itsvse.com/thread-10362-1-1.html

[WebView2] (1) Eerste introductie tot Microsoft Edge WebView2-technologie
https://www.itsvse.com/thread-10361-1-1.html
Disclaimer:
Alle software, programmeermaterialen of artikelen die door Code Farmer Network worden gepubliceerd, zijn uitsluitend bedoeld voor leer- en onderzoeksdoeleinden; De bovenstaande inhoud mag niet worden gebruikt voor commerciële of illegale doeleinden, anders dragen gebruikers alle gevolgen. De informatie op deze site komt van het internet, en auteursrechtconflicten hebben niets met deze site te maken. Je moet bovenstaande inhoud volledig van je computer verwijderen binnen 24 uur na het downloaden. Als je het programma leuk vindt, steun dan de echte software, koop registratie en krijg betere echte diensten. Als er sprake is van een inbreuk, neem dan contact met ons op via e-mail.

Mail To:help@itsvse.com