بدء استخدام "حِزم الويب"

يمكنك مشاركة المواقع الإلكترونية كملف واحد عبر البلوتوث وتشغيلها بلا إنترنت في سياق المصدر.

Kenji Baheux
Kenji Baheux

تجميع موقع إلكتروني كامل كملف واحد وجعله قابلاً للمشاركة يفتح حالات استخدام جديدة للويب. تخيل عالمًا يمكنك فيه:

  • يمكنك إنشاء المحتوى الخاص بك وتوزيعه بشتى الطرق بدون الحاجة إلى مقتصر على الشبكة
  • مشاركة تطبيق ويب أو جزء من محتوى الويب مع أصدقائك عبر البلوتوث أو اتصال Wi-Fi المباشر
  • نقل موقعك الإلكتروني على USB أو استضافته على شبكتك المحلية

وواجهة برمجة التطبيقات Web Bundles API هي أحدث اقتراح يتيح لك تنفيذ كل ذلك.

توافُق المتصفح

إنّ واجهة برمجة التطبيقات Web Bundles API غير متاحة حاليًا إلا في المتصفّحات المستنِدة إلى Chromium ضمن ما يلي: علم تجريبي.

إضافة Web Bundles API

حزمة الويب هي تنسيق ملف لتغليف مورد أو أكثر من موارد HTTP في ملف ملف واحد. يمكن أن تتضمن ملف HTML واحدًا أو أكثر أو ملفات JavaScript أو الصور أو أوراق الأنماط.

حِزم Web Bundle، والمعروفة رسميًا باسم تبادلات HTTP المجمّعة هي جزء من حزمة الويب اقتراحك.

شكل يوضّح أنّ حِزمة الويب هي مجموعة من موارد الويب.
آلية عمل حِزم الويب

تتم فهرسة موارد HTTP في حزمة ويب من خلال عناوين URL للطلبات، ويمكن اختياريًا بالتوقيعات التي تضمن الموارد. تسمح التوقيعات للمتصفّحات فهم مصدر كل مورد والتحقق منه على أنه يأتي من أصلها الحقيقي. وهو ما يشبه الطريقة التي تستخدمها عمليات Signed HTTP Exchange، ميزة لتوقيع مورد HTTP واحد.

تقدم لك هذه المقالة إرشادات حول "مجموعة حزمات الويب" وكيفية استخدامها.

شرح حِزم الويب

على سبيل المثال، حزمة الويب هي ملف CBOR بامتداد .wbn (حسب الاصطلاح) الذي حزم موارد HTTP في تنسيق ثنائي، ويتم عرضها باستخدام application/webbundle MIME الكتابة. يمكنك قراءة المزيد من المعلومات عن هذا في بنية المستوى الأعلى. في مسودة المواصفات.

تتميز حِزم الويب بميزات فريدة متعددة:

  • يتم تغليف صفحات متعددة، ما يتيح تجميع موقع إلكتروني كامل في ملف واحد.
  • تفعيل JavaScript تنفيذي، على عكس MHTML
  • تستخدم صيغ HTTP لتنفيذ التفاوض على المحتوى، ما يتيح نشر المحتوى على نطاق عالمي باستخدام Accept-Language حتى في حال استخدام الحزمة بلا اتصال بالإنترنت
  • يتم تحميله في سياق مصدره عندما يوقّع ناشره بطريقة مشفّرة.
  • يتم تحميلها بشكل فوري تقريبًا عند عرضها محليًا

تفتح هذه الميزات سيناريوهات متعددة. أحد السيناريوهات الشائعة هو القدرة على إنشاء تطبيق ويب مستقل يسهل مشاركته واستخدامه بدون الاتصال بالإنترنت. على سبيل المثال، لنفترض أنك على متن طائرة متجهة من طوكيو إلى سان فرانسيسكو مع صديقك. لا تحب الترفيه أثناء الرحلات الجوية. يلعب صديقك لعبة مثيرة لعبة ويب اسمها PROXX، وستخبرك بأنّهم نزّلوا اللعبة على الويب احصل على خصم قبل الصعود على متن الطائرة. تعمل بلا اتّصال بالإنترنت قبل الويب خُض حزمات، وستنتهي القصة عند هذا الحد وسيكون عليك تناوب الأدوار. تشغيل اللعبة على جهاز صديقك أو العثور على شيء آخر لاجتياز الوقت. ولكن باستخدام حزم الويب، إليك ما يمكنك فعله الآن:

  1. اطلب من صديقك مشاركة ملف .wbn الخاص باللعبة. على سبيل المثال، الملف مباشرةً من نظير إلى نظير باستخدام تطبيق مشاركة الملفات.
  2. افتح ملف .wbn في متصفّح متوافق مع حِزم الويب.
  3. ابدأ اللعب على جهازك الخاص وحاوِل التغلّب على طاقات صديقك الجودة.

إليك فيديو يشرح هذا السيناريو.

كما ترى، يمكن أن تحتوي "حِزمة الويب" على كل مورد، ما يجعلها تعمل بلا اتصال بالإنترنت. وتحميلها بشكل فوري.

إنشاء حِزم الويب

واجهة سطر الأوامر go/bundle هي حاليًا أسهل طريقة لتجميع موقع ويب. go/bundle هو تنفيذ مرجعي لحِزم الويب المواصفات المضمنة في Go.

  1. ثبِّت Go.
  2. تثبيت "go/bundle"

    go get -u github.com/WICG/webpackage/go/bundle/cmd/...
    
  3. استنساخ مستودع preact-todomvc وإنشاء تطبيق الويب للاستعداد لتجميع الموارد.

    git clone https://github.com/developit/preact-todomvc.git
    cd preact-todomvc
    npm i
    npm run build
    
  4. استخدِم الأمر gen-bundle لإنشاء ملف .wbn.

    gen-bundle -dir build -baseURL https://preact-todom.vc/ -primaryURL https://preact-todom.vc/ -o todomvc.wbn
    

تهانينا! تم تغيير حزمة TodoMVC إلى حزمة ويب.

هناك خيارات أخرى للتجميع، وتتوفر المزيد. واجهة سطر الأوامر "go/bundle" يتيح لك إنشاء حزمة ويب باستخدام ملف HAR أو قائمة مخصَّصة من الموارد عناوين URL. يُرجى الانتقال إلى مستودع GitHub للاطّلاع على مزيد من المعلومات. حوالي go/bundle. يمكنك أيضًا تجربة وحدة Node.js التجريبية للتجميع، wbn يُرجى العِلم أنّ "wbn" لا يزال في المراحل الأولى من والتطوير.

استخدام حزم الويب

لتجربة إحدى حزمات الويب:

  1. انتقل إلى about://version لمعرفة إصدار Chrome المثبّت على جهازك. في حال تشغيل إصدار 80 أو أحدث، يمكنك تخطّي الخطوة التالية.
  2. تنزيل Chrome Canary إذا كنت لا تستخدم الإصدار 80 من Chrome أو الأحدث.
  3. فتح "about://flags/#web-bundles"
  4. اضبط علامة حِزم الويب على مفعّلة.

    لقطة شاشة لـ about://flags
    تفعيل حزم الويب في about://flags
  5. أعِد تشغيل Chrome.

  6. اسحب ملف todomvc.wbn وأفلِته في Chrome على جهاز سطح المكتب، أو انقر عليه في ملف. إذا كنت تستخدم Android.

ويتم تنفيذ كل شيء بطريقة سحرية.

تنفيذ Preact لاستخدام TodoMVC بلا اتصال بالإنترنت كحزمة ويب

يمكنك أيضًا تجربة نماذج حزم ويب أخرى:

  • web.dev.wbn هو لقطة لموقع web.dev بالكامل، اعتبارًا من 15 تشرين الأول (أكتوبر) 2019.
  • proxx.wbn: PROXX هو نسخة طبق الأصل من Minesweeper تعمل بلا اتصال بالإنترنت.
  • squoosh.wbn: Squoosh هو أداة مريحة وسريعة لتحسين الصور تتيح لك إجراء مقارنات جنبًا إلى جنب بين تنسيقات ضغط الصور المختلفة، مع إتاحة وتغيير حجم الإحالات الناجحة وتنسيقها

إرسال ملاحظات

لا يزال تنفيذ واجهة برمجة التطبيقات Web Bundle API في Chrome تجريبيًا وغير مكتمل. ليس كل شيء يعمل وقد يحدث عطل أو تعطُّل. لهذا السبب يقع خلف علامة تجريبية. لكن واجهة برمجة التطبيقات جاهزة بما يكفي لاستكشافها في Chrome. تُعد الملاحظات الواردة من مطوري الويب أمرًا بالغ الأهمية لتصميم لواجهات برمجة التطبيقات الجديدة، يُرجى تجربتها وإعلام موظفي Web Bundle بآرائك.

  • إرسال ملاحظات عامة إلى webpackage-dev@chromium.org.
  • إذا كانت لديك ملاحظات حول زيارة المواصفات https://github.com/WICG/webpackage/issues/new للإبلاغ عن مشكلة جديدة في المواصفات، أو إرسال رسالة إلكترونية إلى wpack@ietf.org.
  • إذا عثرت على أيّ مشاكل في سلوك Chrome، انتقِل إلى الرابط التالي: https://crbug.com/new للإبلاغ عن خطأ في Chromium.
  • تُعد أي مساهمات في مناقشة المواصفات والأدوات أكثر من مرحبًا بك. يُرجى الانتقال إلى مستودع المواصفات للمشاركة.

الشكر والتقدير

نود أن نشكر فريق Chrome الهندسي الرائع، كل من كونيهيكو ساكاموتو وتسويوشي هورو وتاكاشي تويوشيما وكينوكو ياسودا وجيفري ياسكي الذين بذلوا جهودًا كبيرة للمساهمة في والمواصفات، وإنشاء الميزة على إصدار Canary، ومراجعة هذه المقالة. خلال دان يورك وعملية توحيد المقاييس في كانت مناقشة مجموعة مهندسي شبكة الإنترنت (IETF) وكذلك ديف كرامر مرجعًا رائعًا حول ما يحتاج إليه الناشرون نودّ أيضًا أن نشكر جيسون ميلر على بذل العظيم والجهد المضطرب لتحسين إطار العمل.