Web sitelerini Bluetooth üzerinden tek bir dosya olarak paylaşın ve kaynağınızın bağlamında çevrimdışı çalıştırın
Tüm web sitesini tek bir dosya olarak paketlemek ve paylaşılabilir hale getirmek, web için yeni kullanım alanlarının önünü açar. Şunları yapabileceğiniz bir dünya hayal edin:
- Kendi içeriğinizi oluşturun ve ağla sınırlı kalmadan her türlü şekilde dağıtın
- Bir web uygulamasını veya web içeriğini Bluetooth ya da Kablosuz Doğrudan Bağlantı üzerinden arkadaşlarınızla paylaşın
- Sitenizi kendi USB'nizde taşıyabilir, hatta kendi yerel ağınızda barındırabilirsiniz.
Web Bundle API, tüm bunları yapabilmenizi sağlayan deneysel bir tekliftir.
Tarayıcı uyumluluğu
Web Bundle API'si şu anda yalnızca Chromium tabanlı tarayıcılarda deneysel bir işaretin arkasında desteklenmektedir.
Web Bundle API'si ile tanışın
Web Paketi, bir veya daha fazla HTTP kaynağını tek bir dosyaya kapsüllemeye yarayan dosya biçimidir. Bir veya daha fazla HTML dosyası, JavaScript dosyası, resim veya stil sayfası içerebilir.
Daha resmi olarak Gruplanmış HTTP Exchange'leri olarak bilinen Web Paketleri, Web Paketleme teklifinin bir parçasıdır.
Web Paketi'ndeki HTTP kaynakları, istek URL'lerine göre dizine eklenir ve isteğe bağlı olarak kaynaklara kefil olan imzalar içerebilir. İmzalar, tarayıcıların her bir kaynağın nereden geldiğini anlayıp doğrulamasını sağlar ve her birini gerçek kaynağından geliyormuş gibi ele alır. Bu, tek bir HTTP kaynağını imzalamaya yönelik bir özellik olan İmzalanmış HTTP Takasları'nın işlenme şekline benzer.
Bu makale, Web Paketi'nin ne olduğu ve nasıl kullanılacağı konusunda size yol gösterir.
Web Paketlerini Açıklama
Daha net bir ifadeyle web paketi, HTTP kaynaklarını ikili program biçiminde paketleyen ve application/webbundle
MIME türüyle sunulan .wbn
uzantısına sahip bir CBOR dosyasıdır. Spesifikasyon taslağının Üst düzey yapı bölümünde bu konu hakkında daha fazla bilgi edinebilirsiniz.
Web Paketleri'nin birden çok benzersiz özelliği vardır:
- Birden çok sayfayı kapsayarak eksiksiz bir web sitesinin tek bir dosyada gruplanmasını sağlar
- MHTML'den farklı olarak yürütülebilir JavaScript'i etkinleştirir
- İçerik pazarlığı için HTTP Varyantları'nı kullanır. Bu, paket çevrimdışı kullanılsa bile
Accept-Language
başlığıyla uluslararasılaştırmaya olanak tanır - Yayıncısı tarafından kriptografik olarak imzalandığında kaynak bağlamında yüklenir
- Yerel olarak sunulduğunda neredeyse anında yüklenir
Bu özellikler birden fazla senaryoya yol açar. Yaygın senaryolardan biri, internet bağlantısı olmadan kolayca paylaşılabilen ve kullanılabilen bağımsız bir web uygulaması oluşturmaktır. Örneğin, arkadaşınızla Tokyo'dan San Francisco'ya bir uçakta olduğunuzu varsayalım. Uçaktaki eğlenceleri sevmediniz. Arkadaşınız PROXX adlı ilginç bir web oyununu oynamaktadır ve uçağa binmeden önce oyunu Web Paketi olarak indirdiğini söylüyor. İnternet bağlantısı olmadan sorunsuz bir şekilde çalışır. Web Paketleri'nden önce hikaye burada biterdi ve oyunu arkadaşınızın cihazında sırayla oynamanız veya vakit geçirmek için başka bir şey bulmanız gerekirdi. Ancak Web Paketleri ile artık şunları yapabilirsiniz:
- Arkadaşınızdan oyunun
.wbn
dosyasını paylaşmasını isteyin. Örneğin dosya, bir dosya paylaşım uygulaması kullanılarak eşler arası kolayca paylaşılabilir. .wbn
dosyasını, Web Bundle'ı destekleyen bir tarayıcıda açın.- Oyunu kendi cihazınızda oynamaya başlayın ve arkadaşınızın rekorunu geçmeye çalışın.
Bu senaryoyu açıklayan bir videoyu burada bulabilirsiniz.
Gördüğünüz gibi, Web Bundle her kaynağı içerebilir. Böylece çevrimdışı olarak çalışır ve anında yüklenir.
Web Paketleri oluşturma
go/bundle
KSA şu anda bir web sitesini gruplandırmanın en kolay yoludur. go/bundle
, Go'da yerleşik olarak bulunan Web Bundle spesifikasyonunun referans uygulamasıdır.
- Go'yu yükleyin.
go/bundle
uygulamasını yükleyin.go get -u github.com/WICG/webpackage/go/bundle/cmd/...
preact-todomvc deposunu klonlayın ve kaynakları paket haline getirmeye hazırlanmak için web uygulamasını oluşturun.
git clone https://github.com/developit/preact-todomvc.git cd preact-todomvc npm i npm run build
.wbn
dosyası oluşturmak içingen-bundle
komutunu kullanın.gen-bundle -dir build -baseURL https://preact-todom.vc/ -primaryURL https://preact-todom.vc/ -o todomvc.wbn
Tebrikler! TodoMVC artık bir Web Paketi.
Gruplama için başka seçenekler de mevcut ve yakında daha fazlası da eklenecek. go/bundle
CLI, HAR dosyası veya özel kaynak URL'leri listesi kullanarak bir Web Paketi derlemenize olanak tanır. go/bundle
hakkında daha fazla bilgi edinmek için GitHub kod deposunu ziyaret edin. Paket oluşturmak için deneysel Node.js modülünü de deneyebilirsiniz,
wbn
. wbn
, geliştirmenin hâlâ ilk aşamalarındadır.
Web Paketleri ile denemeler yapma
Bir Web Paketi'ni denemek için:
- Hangi Chrome sürümünü kullandığınızı öğrenmek için
about://version
adresine gidin. 80 veya sonraki bir sürümü çalıştırıyorsanız bir sonraki adımı atlayın. - Chrome 80 veya sonraki bir sürümü kullanmıyorsanız Chrome Canary'yi indirin.
about://flags/#web-bundles
adlı kişiyi aç.Web Bundle işaretini Etkin olarak ayarlayın.
Chrome'u yeniden başlatın.
Masaüstündeyseniz
todomvc.wbn
dosyasını Chrome'a sürükleyip bırakın veya Android kullanıyorsanız bir dosya yönetimi uygulamasında bu dosyaya dokunun.
Her şey sihirli bir şekilde çalışıyor.
Diğer örnek web paketlerini de deneyebilirsiniz:
- web.dev.wbn, tüm web.dev sitesinin 15 Ekim 2019 itibarıyla anlık görüntüsüdür.
- proxx.wbn: PROXX, çevrimdışı çalışan bir Mayın Tarlası klonudur.
- squoosh.wbnSquoosh, dönüşümleri yeniden boyutlandırma ve biçimlendirme desteğiyle, çeşitli resim sıkıştırma biçimlerinin yan yana karşılaştırmasını yapmanızı sağlayan kullanışlı ve hızlı bir resim optimizasyon aracıdır.
Geri bildirim gönder
Chrome'daki Web Bundle API uygulaması deneyseldir ve eksiktir. Her şey çalışmıyor, başarısız olabilir veya kilitlenebilir. Bu nedenle, deneme amaçlı bir bayrağın arkasında bulunuyor. Ancak API, Chrome'da keşfetmeniz için yeterlidir. Yeni API'lerin tasarımında web geliştiricilerinden gelen geri bildirimler çok önemlidir. Bu nedenle, lütfen deneyin ve Web Bundle üzerinde çalışan kişilere düşüncelerinizi iletin.
- webpackage-dev@chromium.org adresine genel geri bildirim gönderin.
- Spesifikasyonla ilgili geri bildirimde bulunmak isterseniz yeni bir spesifikasyon sorunu bildirmek için https://github.com/WICG/webpackage/issues/new adresini ziyaret edin veya wpack@ietf.org'a e-posta gönderin.
- Chrome'un davranışında herhangi bir sorun bulursanız Chromium hatası bildirmek için https://crbug.com/new adresini ziyaret edin.
- Spesifikasyon tartışması ve araçlarına yapılacak katkılar da memnuniyetle karşılanacaktır. Katılmak için spesifikasyon deposunu ziyaret edin.
Onaylar
Teknik özelliklere katkıda bulunan, Canary'de özelliği geliştiren ve bu makaleyi inceleyen Kunihiko Sakamoto, Tsuyoshi Horo, Takashi Toyoshima, Kinuko Yasuda ve Jeffrey Yasskin'e teşekkürlerimizi sunmak istiyoruz. Standartlaştırma sürecinde Dan York IETF tartışmasında yol gösterici olmuştur. Ayrıca Dave Cramer, yayıncıların gerçekte neye ihtiyaç duyduklarıyla ilgili harika bir kaynak olmuştur. Preact-todomvc'nin muhteşem katkısı ve çerçeveyi daha iyi hale getirmek için gösterdiğiniz hızsız çaba için Jason Miller'a da teşekkür etmek istiyoruz.