Bu makale makine çevirisi ayna makalesidir, orijinal makaleye geçmek için lütfen buraya tıklayın.

Görünüm: 15907|Yanıt: 2

CEF: İstemci için Chrome gömmek

[Bağlantıyı kopyala]
Yayınlandı 22.09.2017 16:19:26 | | |
CEF nedir?
CEF, Google Chromium projesine dayanan ve Windows, Linux ve Max platformlarını destekleyen açık kaynaklı bir web tarayıcı kontrolü olan Chromium Embedded Framework'ün kısaltmasıdır. C/C++ arayüzlerinin yanı sıra, diğer diller için de portlar mevcuttur.

Chromium tabanlı olduğu için CEF, Webkit & Chrome'da uygulanan HTML5 özelliklerini destekler ve performans açısından Chrome'a oldukça yakındır.

CEF ayrıca şu özellikleri sunar: özel eklentiler, özel protokoller, özel Javascrip nesneleri ve uzantılar; Kontrol edilebilir kaynak yükleme, gezinme, bağlam menüleri vb.

CEF'i kim kullanıyor
Herkesin CEF ile ne yaptığını göstermek için bazı pratik örnekler kullanalım:

Çeşitli tarayıcılar

Erken çift çekirdekli tarayıcılar (IE + Webkit) bazıları CEF'i Webkit çekirdeği tarayıcı kontrolü olarak kullanıyordu.

Ancak tarayıcılar için, doğrudan Chrome üzerinden genişletme aslında kral ve şimdi herkes bunu yapıyor (çeşitli hızlı tarayıcılar).

Evernote Client (Windows üzerinde)

Evernote, kullanıcıların web sayfalarını notlara yapıştırmasına olanak tanır ve ayrıca web sayfalarını not olarak kaydetmek için eklentiler sunar.

Bu, sayfayı istemcide doğru şekilde render etme ihtiyacı olmalı ve bu görev CEF'e bırakılıyor.

GitHub Client (Windows üzerinde)

GitHub ayrıca performans açısından projeyi göstermek için kullanılan ReadMe sayfasının CEF olması gerektiğini libcef.dll ve başka yerlerde arayüz de kısmen sayfalarla birlikte uygulanabilir.

QQ

QQ, IE'yi çok uzun zaman önce gömmekle bazı fonksiyonlar ve arayüzler uyguladı. Geçen yıldan beri QQ, daha önce IE kullanan bazı yerlerin yerini alan CEF'i tanıttı; böylece Webkit temelli bazı yeni özellikler kullanılabiliyor ve aynı zamanda hız, istikrar ve uyumluluk açısından avantajlar kazandı.

Adobe Edge Animate & Adobe Edge Reflow

Adobe, modern web sayfalarından (ya da HTML5'ten?) oluşan tam bir seti başlattı. Edge.

Adobe Edge Animate, animasyon için zaman çizelgesini düzenleyip orijinaller (Edge Animate'de semboller olarak adlandırılır) oluşturarak karmaşık animasyonlar elde edebilir.

Edge Reflow, Tasarım ve duyarlı web tasarımıdır. Bazı insanlar bunu responsive olarak çeviriyor, ki bu aslında adaptif.

Yukarıdaki iki yazılım temelde Webkit çekirdeğinin tarayıcısına yöneliktir, bu nedenle WYSIWYG önizleme ve düzenleme arayüzü sağlamak için bir Webkit çekirdeği gömülmesi gereklidir. Hepsi CEF kullanıyordu. (CEF ile saf Webkit arasındaki fark daha sonra açıklanacak)

Q+

Web App kavramı altında, Q+ web sayfaları için çalışma ortamı sağlar (kısaca söylemek gerekirse: istemci kutusu ve bazı mevcut API'ler) ve IE ile Webkit çekirdeklerini destekler.

Web geliştirme öğrencileri için, tanıttığımız Webkit çekirdeği (aslında CEF) IE'nin sürüm uyumluluk sorunlarını dikkate almak zorunda değil; bu sadece geliştirme verimliliğini artırmakla kalmaz, aynı zamanda bazı yeni HTML5 özelliklerinden faydalanmamıza da olanak tanır. O dönemde Q+'ın uygulama pazarı, mesaj merkezi, duvar kağıtları, müzik widget'ları ve diğer uygulamalar hepsi Webkit çekirdeği temelinde geliştirilmişti.

Q+ projesinin CEF için daha fazla girişimde bulunduğu söylenebilir, örneğin:

Geliştirilen müzik widgetı HTML5 ses etiketini kullanır;

Bazı uygulamalar HTML5'in çevrimdışı işlevselliğini (örneğin manifest dosyasıyla birlikte) kullanır, ancak elbette bazı sürprizler ve döngeler var ve ben çok fazla deneyim kazandım.

Paketlenmiş Webkit Geliştirme Araçları.

Özel protokoller: Örneğin, qplus:// protokollerine erişim özel bir klasöre yönlendirilebilir.

Ekran Dışı Renderleme (OSR): Ekran dışı renderleme + Windows Katmanlı Pencere kullanılarak düzensiz bir web sayfası penceresi oluşturulur (web sayfasının opak alanının şekli, pencerenin şekli nedir)

CEF'i müşteriler için neden gömülüyorsunuz?
Bu kadar çok örnekle, bu soruyu söylemek çok daha kolay:

Web sayfalarını görüntülemek ve çeşitli Web servislerini kullanmak için kullanılır;

Kullanıcı arayüzü için web sayfalarını kullanın;

Ses, tuval gibi HTML5 özelliklerini, CSS3 özellikleri dahil olmak üzere kullanın.

Ekran Dışı Renderleme (OSR):

OSR olarak adlandırılan yöntem, gerçek bir pencere oluşturmadan tüm sayfayı bir bitmap üzerinde render etmektir. Tabii ki, sadece render değil, aynı zamanda fare, klavye olayları, giriş yöntemi olayları vb. işlemlerini de yönetmek için bir dizi API var.

Bu özellik özellikle gerçek pencereler kullanılamadığında, örneğin Katmanlı Pencerelerde veya oyunlarda dokulara göre render edildiğinde faydalıdır.

OSR özellikleri kullanılarak bazı ilginç efektler yapılabilir, örneğin:

AlloyTeam, OSR kullanarak tarayıcı, oynatıcı vb. üreten Webtop üretti.

OSR'yi destekleyen bir Awesomium projesi var ve zaten oyunlarda web sayfalarını render etmek için Awesomium kullanan oyun projeleri var. (Awesomium'un çıktı dosyasına baktığımda, CEF uygulamasına benzer olmalı, hepsi bir Chromium paketi ve AWESOMIUM'un yapabildiği CEF de yapılmalıdır)

Boş zamanlarımda bir demo yaptım ve CEF ile OpenGL Texture'da web sayfalarını render ettim; bu, CEF'i oyuna uygulamak için küçük bir deneme olarak görülebilir, şekilde gösterildiği gibi:

Oyun içi tarayıcı demosu

Neden CEF?
IE

IE uzun zamandır gömülü bir tarayıcı kontrolü ve kesin olmak gerekirse, artık IE'ye birçok alternatifimiz var.

CEF vs IE:

Uyumluluk:

IE: Çekirdek, işletim sistemine bağlı olarak 6 ila 10 versiyon arasında değişir ve bu sürümlerle uyumlu olması için web geliştirme iş yükü küçümsenmez.

CEF: Webkit çekirdeğini kullanır ve özellikler açısından bir CEF versiyonu Chrome sürüm numarasına karşılık gelebilir, böylece web geliştirme net bir özellik setine sahip olur ve uyumluluk üzerine çalışma yükünü ortadan kaldırır.

HTML5 Standardı ve Yeni Özellikler:

IE: Tabii ki, eski IE sürümleri en son HTML özelliklerini ve standartlarını desteklemiyor.

CEF: Webkit ve Chrome'un yeni özellikleri desteklemede öncü olduğu kesin.

Açık Kaynak ve Platformlar Arası:

Yani açık kaynak değil, Windows platformuyla sınırlı

CEF: Açık kaynak, kullanılan Webkit ve Chromium hepsi açık kaynaklıdır, açık kaynak daha fazla özelleştirilebilir olasılık demektir; Ve Windows, Mac ve Linux'u kapsıyor.

Ekran Dışı Renderleme (OSR):

Yani bazı hilelerle ekran dışı render elde edebilirsiniz, ancak iş yükü küçük değil ve resmi olarak desteklenmiyor.

CEF: Özel bir ekran dışı render modu ve buna karşılık gelen API var.

Penetrasyon:

IE: Tüm Windows kullanıcılarında IE bulunur, bu IE'nin avantajıdır (ancak bazı kullanıcıların IE ayarları hatalıdır, bu da kullanılamazlığa yol açar, örneğin jscrip{filtering}t.dll kayıtlı değil ve Javascrip{filter}t kullanılamaz hale gelir)

CEF: Kendin kurup paketlemen gerekiyor

Webkit

Neden CEF ile Webkit'i kasıtlı olarak karşılaştırıyorsunuz?

Yakın zamanda Webkit'in ne olduğu, ne olmadığı ve neden bu kadar çok Webkit portu olduğu hakkında iyi bir makale okudum: "WebKit hakkında Geliştiricilerin Bilmesi Gerekenler"

İşte kaba bir özet:

Webkit, web sayfaları için ayrıştırma ve düzenleme motorudur ve tüm Webkit tabanlı tarayıcılar tarafından paylaşılmaktadır. Varsayılan Webkit portu Safari'dir; bu, Webkit kaynak kodu derlemesinden indirilen sürümdür. Chromium, QtWebkit gibi diğer Webkit portları da var; bunlar 2D grafikler, GPU hızlandırma, Javascrip motoru, ses/video kod çözme gibi farklı uygulamalara sahiptir.

CEF vs webkit (aslında Chromium vs Webkit)

V8 motoru, skia'nın 2D render kullanımı, Chromium'un GPU hızlandırmalı uygulaması vb., Chromium'un mükemmel uygulamasının yardımıyla CEF de mükemmel bir Webkit portu haline geldi.

CEF Dezavantajları:
Nazik olun, CEF'in de kendi eksiklikleri ve kısıtlamaları vardır, sadece avantajlarından bahsedemezsiniz, burada CEF'in dezavantajlarını ve dezavantajlarını tanıtacağım:

Hacim:

CEF'in en son sürümünde, tüm DLL'lerin toplamı yaklaşık 40M olmalı ve sıkıştırmadan sonra bunun 10M+ olacağı tahmin ediliyor. Projeniz büyük değilse ve alamazsa, CEF size göre değildir.

Tabii ki, artık G ile hesaplanan oyunlar için bu hacim yine de kabul edilebilir olmalı.

Sıradan müşteri projeleri için, projenin CEF tarafından uygulanan özellikleri kullanması gerekip gerekmediğine ve ürünün kurulum paketini bu kadar artırmanın değerli olup olmadığına bağlıdır. Elbette, burada kurulum sonrası indirme gibi bazı uygulama tavizleri de var (şahsen bunun anlamlı olduğunu düşünmüyorum, sonuçta paket kuran kullanıcılar hızlandırmak için yazılım indirmeyi de seçebilirler)

Önbellek:

Chrome'un önbelleği yalnızca bir işlem okuma ve yazma için tasarlanmış, aynı şey CEF için de geçerlidir.

Birden fazla kez açılması gereken istemciler için, her işlem örneği için yalnızca farklı bir önbellek klasörü belirtilebilir. Ancak bu kesinlikle sabit disk kullanımını artırır ve ayrıca başlangıçta önbelleklenmiş bazı dosyaların birden fazla kez indirilmesine neden olur (örneğin, A süreci jQuery.js önbelleyer, B süreci ise farklı dizinleri önbellekleyerek bir kez talep edip önbellemek zorunda kalır jQueyr.js

OSR:

OSR şu anda gerçek pencere modu gibi değil, GPU tarafından hızlandırılabilir ve OSR yalnızca yazılım kullanılarak render edilebiliyor, bu da bazı CSS 3D efektlerinin desteklenememesi anlamına geliyor.

Ancak OSR'nin özellikleri hâlâ geliştiriliyor ve şahsen bence yine de dört gözle beklemeye değer.

Sonra ne paylaşacağız
Bu kadar çok yazdıktan sonra, bunu CEF'e bir giriş olarak kabul edebilirim ve gelecekte CEF'in nasıl kullanılacağı gibi bazı kuru maddeler yazacağım, bunlar arasında:

CEF kod edinimi, derleme, gömülme, sayfa ve istemci API çağrılarını işlemek, OSR ekran dışı render işleme, önbellekleme, özel protokoller, CEF1 ve CEF3 vb.

Bugün bu kadar.





Önceki:Redis uzaktan bağlantı ve erişim şifreleri kurar
Önümüzdeki:ASP.NET sayfada aynı anda birden fazla istek varsa, askıya alınmış animasyon engelleme durumu vardır
Yayınlandı 25.02.2019 09:14:24 |
Harika
 Ev sahibi| Yayınlandı 12.08.2023 20:08:02 |
WebView2 (6) WebView2 çalışma zamanını dağıt ve dağıt
https://www.itsvse.com/thread-10372-1-1.html

[WebView2] (5) Sanal hostun yerel HTML kaynaklarının yüklenmesi
https://www.itsvse.com/thread-10367-1-1.html

[WebView2] (4) Web ve WinForm birbirlerine fonksiyon metlerini çağırır
https://www.itsvse.com/thread-10365-1-1.html

WebView2 (3) Web ile WinForm uygulamaları arasında çift yönlü iletişim
https://www.itsvse.com/thread-10364-1-1.html

[WebView2] (2) WinForm, web içeriğini görüntülemek için WebView2'yi tanıtıyor
https://www.itsvse.com/thread-10362-1-1.html

[WebView2] (1) Microsoft Edge WebView2 teknolojisine ilk giriş
https://www.itsvse.com/thread-10361-1-1.html
Feragatname:
Code Farmer Network tarafından yayımlanan tüm yazılım, programlama materyalleri veya makaleler yalnızca öğrenme ve araştırma amaçları içindir; Yukarıdaki içerik ticari veya yasa dışı amaçlarla kullanılamaz, aksi takdirde kullanıcılar tüm sonuçları ödemelidir. Bu sitedeki bilgiler internetten alınmakta olup, telif hakkı anlaşmazlıklarının bu siteyle hiçbir ilgisi yoktur. Yukarıdaki içeriği indirmeden sonraki 24 saat içinde bilgisayarınızdan tamamen silmelisiniz. Programı beğendiyseniz, lütfen orijinal yazılımı destekleyin, kayıt satın alın ve daha iyi orijinal hizmetler alın. Herhangi bir ihlal olursa, lütfen bizimle e-posta yoluyla iletişime geçin.

Mail To:help@itsvse.com