تعرَّف على سبب قرار مشروع Excalidraw إيقاف استخدام حزمة Electron لصالح الإصدار المتوافق مع الويب.
في ما يتعلّق بمشروع Excalidraw، قرّرنا إيقاف إصدار Excalidraw Desktop نهائيًا، وهو ملف Electron لتطبيق Excalidraw، وذلك لصالح إصدار الويب الذي يمكنك العثور عليه على excalidraw.com في أي وقت. بعد إجراء تحليل دقيق، قرّرنا أنّ تطبيق الويب التقدّمي هو المستقبل الذي نريد الاعتماد عليه. اطّلِع على المزيد من المعلومات لمعرفة السبب.
كيفية إنشاء تطبيق Excalidraw Desktop
بعد فترة قصيرة من إنشاء @vjeux للإصدار الأول من Excalidraw في كانون الثاني (يناير) 2020 ونشر مدوّنة عنه، اقترح ما يلي في الطلب رقم 561:
سيكون من الرائع تضمين Excalidraw في Electron (أو ما يعادله) ونشره كتطبيق [خاص بالمنصة] في متاجر التطبيقات المختلفة.
كان ردّ @voluntadpear الفوري هو اقتراح ما يلي:
ما رأيك في تحويله إلى تطبيق ويب تقدّمي بدلاً من ذلك؟ يتيح نظام Android حاليًا إضافة هذه الأنشطة إلى "متجر Play" على أنّها "أنشطة ويب موثوق بها"، ونأمل أن يتيح نظام التشغيل iOS إجراء ذلك قريبًا. على أجهزة الكمبيوتر المكتبي، يتيح لك Chrome تنزيل اختصار لتطبيق ويب تقدّمي على الكمبيوتر المكتبي.
كان القرار الذي اتّخذه @vjeux في النهاية بسيطًا:
علينا إجراء كلا الإجراءَين.
على الرغم من أنّه تم بدء العمل على تحويل إصدار Excalidraw إلى تطبيق ويب تقدّمي من قِبل @voluntadpear ثم من قِبل آخرين، بدأ @lipis بشكل مستقل العمل على إنشاء مستودع منفصل لتطبيق Excalidraw Desktop.
حتى يومنا هذا، لم يتم تحقيق الهدف الأول الذي حدّده @vjeux، وهو إرسال Excalidraw إلى متاجر التطبيقات المختلفة. بصراحة، لم يبدأ أحد حتى عملية الإرسال إلى أي من المتاجر. ما السبب في ذلك؟ قبل الإجابة، لنطّلِع على Electron، المنصة.
ما هو Electron؟
تتمثل الميزة الفريدة لإطار عمل Electron في أنّه يسمح لك "بإنشاء تطبيقات متوافقة مع جميع الأنظمة الأساسية على أجهزة الكمبيوتر المكتبي باستخدام JavaScript وHTML وCSS". التطبيقات التي تم إنشاؤها باستخدام Electron هي "متوافقة مع Mac وWindows وLinux"، أي "يتم إنشاء تطبيقات Electron وتشغيلها على ثلاثة أنظمة أساسية". وفقًا للصفحة الرئيسية، فإنّ الأجزاء الصعبة التي يسهّلها Electron هي التحديثات التلقائية، القوائم والإشعارات على مستوى النظام، الإبلاغ عن الأعطال، تصحيح الأخطاء وإنشاء الملفات الشخصية، أدوات تثبيت Windows. تبيّن أنّ بعض الميزات المُعلَن عنها تتطلّب مراجعة التفاصيل الصغيرة.
على سبيل المثال، "لا تتوفّر [حاليًا] [التحديثات التلقائية] إلّا على نظامَي التشغيل macOS وWindows. "لا يتوفّر دعم مضمّن لميزة التحديث التلقائي على نظام التشغيل Linux، لذا ننصحك باستخدام مدير الحِزم في التوزيع لتحديث تطبيقك".
يمكن للمطوّرين إنشاء قوائم على مستوى النظام من خلال استدعاء
Menu.setApplicationMenu(menu). على نظامَي التشغيل Windows و Linux، سيتم ضبط القائمة على أنّها القائمة العلوية لكل نافذة، في حين أنّه على نظام التشغيل macOS، تتوفّر العديد من القوائم العادية التي يحدّدها النظام، مثل قائمة الخدمات. لجعل القوائم قائمة عادية، على المطوّرين ضبطroleللقائمة وفقًا لذلك، وسيتم التعرّف عليها من خلال Electron وتحويلها إلى قوائم عادية. وهذا يعني أنّ الكثير من الرمز المرتبط بالملف الشخصي سيستخدم عملية التحقّق من المنصة التالية:const isMac = process.platform === 'darwin'.يمكن إنشاء أدوات تثبيت Windows باستخدام windows-installer. يُبرز ملف README الخاص بالمشروع أنّه "بالنسبة إلى التطبيق المخصّص للإصدار العلني، عليك توقيع تطبيقك. سيحظر ملف تعريف الارتباط SmartScreen في Internet Explorer تنزيل تطبيقك، وسيصنّف العديد من مورّدي برامج مكافحة الفيروسات تطبيقك كبرنامج ضار ما لم تحصل على شهادة صالحة" [sic].
عند الاطّلاع على هذه الأمثلة الثلاثة فقط، يتضح أنّ Electron بعيد كل البعد عن ميزة "الكتابة مرة واحدة والتشغيل في كل مكان". يتطلب توزيع التطبيق على متاجر التطبيقات استخدام توقيع الرمز البرمجي، وهي تقنية أمان لشهادة ملكية التطبيق. تتطلّب تعبئة التطبيق استخدام أدوات مثل electron-forge والتفكير في مكان استضافة الحِزم لتحديثات التطبيق. ويصبح الأمر معقّدًا بسرعة نسبية، خاصةً عندما يكون الهدف هو إتاحة التطبيق على جميع المنصات. أريد أن أشير إلى أنّه من الممكن تمامًا إنشاء تطبيقات ملفتة للنظر باستخدام IDE باستخدام الجهد والالتزام الكافيَين. بالنسبة إلى Excalidraw Desktop، لم نتمكّن من حلّ المشكلة.
مواصلة العمل من حيث توقفت في Excalidraw Desktop
يُعدّ Excalidraw Desktop حتى الآن تطبيق الويب Excalidraw مجمّعًا كملف
.asar مع إضافة نافذة لمحة عن Excalidraw. يكون شكل التطبيق
وأسلوبه مطابقَين تقريبًا لإصدار الويب.
على نظام التشغيل macOS، تتوفّر الآن قائمة على مستوى النظام في أعلى التطبيق، ولكن بما أنّه لا يمكن ربط أي من إجراءات القائمة، باستثناء إغلاق النافذة ولمحة عن Excalidraw، بأي شيء، فإنّ القائمة في حالتها الحالية غير مفيدة على الإطلاق. في الوقت نفسه، يمكن تنفيذ جميع الإجراءات من خلال أشرطة أدوات Excalidraw العادية وقائمة السياق.
نستخدم electron-builder الذي يتيح
ربط أنواع الملفات.
من المفترض أن يؤدي النقر مرّتين على ملف .excalidraw إلى فتح تطبيق Excalidraw Desktop. يظهر مقتطف electron-builder.json المعنيّ على النحو التالي:
{
"fileAssociations": [
{
"ext": "excalidraw",
"name": "Excalidraw",
"description": "Excalidraw file",
"role": "Editor",
"mimeType": "application/json"
}
]
}
في الواقع، لا يعمل هذا الإجراء دائمًا على النحو المطلوب، لأنّ التطبيقات على نظام التشغيل Windows 10 لا تملك الحقوق اللازمة لربط نوع ملف بها، وذلك استنادًا إلى نوع التثبيت (للمستخدم الحالي أو لجميع المستخدمين).
وقد كانت هذه العيوب والعمل غير المكتمل لجعل التجربة شبيهة بالتطبيق على جميع المنصات (وهو أمر يمكن تحقيقه من خلال بذل الجهد الكافي) سببًا قويًا لإعادة النظر في استثمارنا في Excalidraw Desktop. ومع ذلك، كان لدينا سبب أكبر يدفعنا إلى ذلك، وهو أنّنا نتوقّع أنّه لن نحتاج إلى كل الميزات التي يوفّرها Electron في حالة الاستخدام التي نتعامل معها. إنّ مجموعة قدرات الويب المتزايدة والمستمرة في النمو تخدمنا بشكلٍ جيد بالقدر نفسه، إن لم يكن أفضل.
كيفية استفادة المستخدمين من الويب في الوقت الحالي وفي المستقبل
حتى في عام 2020، لا يزال jQuery رائجًا بشكلٍ كبير. وقد أصبح استخدام jQuery عادةً لدى العديد من المطوّرين، على الرغم من أنّه قد لا يحتاجون إلى jQuery اليوم. يتوفّر مرجع مشابه لتطبيق Electron، وهو بعنوان قد لا تحتاج إلى Electron. سأوضّح سبب اعتقادنا بأنّنا لا نحتاج إلى Electron.
تطبيق ويب تقدّمي قابل للتثبيت
أصبح Excalidraw اليوم تطبيق ويب تقدّميًا قابلاً للتثبيت يتضمّن مشغّل خدمات و بيان تطبيق ويب. وتخزِّن هذه الصفحة جميع مواردها في مخزّنين مؤقتَين، أحدهما لحفظ الخطوط وملفات CSS ذات الصلة بالخطوط والآخر لحفظ كل المحتوى الآخر.
يعني ذلك أنّ التطبيق متوافق تمامًا مع وضع عدم الاتّصال بالإنترنت ويمكن تشغيله بدون اتصال بالشبكة. تطلب المتصفّحات المستندة إلى Chromium على كلٍّ من أجهزة الكمبيوتر المكتبي والأجهزة الجوّالة من المستخدم تثبيت التطبيق. يمكنك الاطّلاع على طلب التثبيت في لقطة الشاشة أدناه.
تم ضبط Excalidraw ليعمل كتطبيق مستقل، لذا عند تثبيته، ستحصل على تطبيق يعمل في نافذته الخاصة. وهو مدمج بالكامل في واجهة مستخدم المهام المتعددة في نظام التشغيل ويحصل على رمز التطبيق الخاص به على الشاشة الرئيسية أو شريط التطبيقات أو شريط المهام، وذلك استنادًا إلى النظام الأساسي الذي يتم تثبيته عليه.
الوصول إلى نظام الملفات
يستخدم Excalidraw browser-fs-access ل الوصول إلى نظام ملفات نظام التشغيل. في المتصفّحات المتوافقة، يتيح ذلك تنفيذ سير عمل حقيقي يتضمن الخطوات التالية: فتح→تعديل→حفظ، وعمليات حفظ إضافية و "حفظ باسم"، مع توفير بديل شفاف للمتصفّحات الأخرى. يمكنك الاطّلاع على مزيد من المعلومات حول هذه الميزة في مشاركة المدوّنة التي نشرتها بعنوان قراءة الملفات والأدلة وكتابتها باستخدام مكتبة browser-fs-access.
إتاحة السحب والإفلات
يمكن سحب الملفات وإفلاتها في نافذة Excalidraw تمامًا كما هو الحال في التطبيقات المخصّصة للمنصة. في متصفح يتوافق مع واجهة برمجة التطبيقات File System Access API، يمكن تعديل ملف تم إسقاطه على الفور وحفظ التعديلات في الملف الأصلي. إنّ هذه العملية سهلة الاستخدام لدرجة أنّك تنسى أحيانًا أنّك تتعامل مع تطبيق ويب.
الوصول إلى الحافظة
يعمل تطبيق Excalidraw بشكل جيد مع حافظة نظام التشغيل. يمكن نسخ رسومات Excalidraw بالكامل أو
العناصر الفردية فقط ولصقها بتنسيقَي image/png وimage/svg+xml، ما يتيح
دمجها بسهولة مع أدوات أخرى خاصة بالمنصة، مثل Inkscape أو
الأدوات المستندة إلى الويب، مثل SVGOMG.
معالجة الملفات
يتيح تطبيق Excalidraw حاليًا استخدام واجهة برمجة التطبيقات التجريبية File Handling API،
ما يعني أنّه يمكن النقر مرّتين على ملفات .excalidraw في مدير ملفات نظام التشغيل
وفتحها مباشرةً في تطبيق Excalidraw، لأنّ Excalidraw يتم تسجيله كمعالج ملفات لملفات .excalidraw
في نظام التشغيل.
تسجيل الروابط التعريفية
يمكن مشاركة رسومات Excalidraw باستخدام رابط. في ما يلي مثال على ذلك. في المستقبل، إذا كان المستخدمون قد ثبَّتوا Excalidraw كتطبيق ويب تقدّمي، لن يتم فتح هذه الروابط في علامة تبويب متصفّح، بل سيتم تشغيل نافذة مستقلة جديدة. في انتظار التنفيذ، سيعمل هذا الإجراء بفضل التقاط الروابط التعريفية، وهو اقتراح رائج في الوقت الحالي لاستخدام ميزة جديدة في منصة الويب.
الخاتمة
لقد قطعت شبكة الويب شوطًا طويلاً، حيث تم طرح المزيد والمزيد من الميزات في المتصفّحات التي لم يكن من الممكن توفّرها على الويب قبل بضع سنوات أو حتى أشهر، وكانت حصرية للتطبيقات المخصّصة للنظام الأساسي. يُعدّ Excalidraw في طليعة الميزات المتاحة في المتصفّح، مع الاعتراف بأنّه ليس كل المتصفّحات على جميع المنصات تتيح كل ميزة نستخدمها. من خلال الاعتماد على استراتيجية تحسين تدريجي، نتمكّن من الاستفادة من أحدث الميزات وأفضلها كلما أمكن ذلك، بدون إغفال أي مستخدم. يمكن مشاهدتها بشكل أفضل في أي متصفّح.
لقد ساعدنا Electron كثيرًا، ولكن في العام 2020 وما بعده، يمكننا الاستغناء عنه. بالنسبة إلى هدف @vjeux: بما أنّ "متجر Google Play" لأجهزة Android يقبل الآن التطبيقات المتوافقة مع الأجهزة الجوّالة التي تعمل على الويب في شكل ملف مُجمّع يُعرف باسم نشاط الويب الموثوق به، وبما أنّ متجر Microsoft يتيح التطبيقات المتوافقة مع الأجهزة الجوّالة التي تعمل على الويب، يمكنك أيضًا توقّع توفّر Excalidraw في هذه المتاجر في المستقبل القريب. في هذه الأثناء، يمكنك استخدام Excalidraw وتثبيته في المتصفّح ومنه في أي وقت.
الشكر والتقدير
راجع هذه المقالة كلّ من @lipis و @dwelle و Joe Medley.