- تتيح PyScript تضمين لغة بايثون في HTML باستخدام WebAssembly، وتدعم مكتبات قوية مثل NumPy و Pandas.
- يقوم Brython بترجمة كود Python إلى JavaScript، مما يجعله مثاليًا للتلاعب الخفيف بعناصر DOM و SVG.
- تُعد تقنية WebAssembly التقنية الرئيسية التي تسمح بتشغيل اللغات المترجمة على الويب بأداء قريب من الأداء الأصلي.
- توجد بدائل تقليدية تعتمد على الخادم مثل Flask و Django للتعامل مع منطق الواجهة الخلفية.
لطالما كان توظيف قوة لغة بايثون في بيئة المتصفح حلمًا يراود العديد من المطورين. وحتى وقت قريب، كانت جافا سكريبت هي اللغة الوحيدة المتاحة لتنفيذ منطق جانب العميل دون الاعتماد على خادم خارجي، إذا كنت ترغب في تحريك أي شيء على الويب.
لكن المشهد تغير جذرياً بفضل ظهور أدوات ومعايير متنوعة تُزيل حواجز البرمجة الخلفية . اليوم، توجد طرق متعددة لدمج بايثون مع HTML، بدءاً من المترجمات التي تُحوّل الشفرة إلى استخدام تقنيات ثنائية تُتيح أداءً مذهلاً مباشرةً في علامة تبويب متصفحك الرائد مثل كروم.
باي سكريبت: ثورة الأناكوندا

كان أحد أهم التطورات المتقدمة هو إصدار أناكوندا لـ PyScript. هذا الإطار هو ببساطة طبقة تغليف فوق... Pyodide و Emscripten و WebAssembly (Wasm)يُتيح هذا تشغيل بايثون بشكل شبه شفاف على جهاز المستخدم. أما الجانب الأكثر جاذبية فهو أنه يسمح لك بكتابة كود بايثون مباشرةً داخل وسوم HTML مخصصة، مثل: <py-script>مما يسهل بشكل كبير إنشاء تطبيقات تفاعلية.
للبدء، ما عليك سوى تضمين ملفات PyScript CSS وJS في رأس المستند. إحدى مزاياها الرائعة هي أن يدعم المكتبات الضخمة مثل NumPy أو Pandas أو Scikit-learn، والتي يمكن تهيئتها باستخدام الوسم <py-env>بالإضافة إلى ذلك، يوفر PyScript التواصل ثنائي الاتجاه باستخدام جافا سكريبتيسمح هذا البرنامج بالتلاعب بنموذج كائن المستند (DOM) الخاص بالمتصفح باستخدام الوحدة النمطية. js بايثون.
أما بالنسبة للواجهة، فإن PyScript لا تقصر في هذا الجانب، إذ أنها توفر مكونات واجهة المستخدم المتكاملة كما <py-button> o <py-inputbox>والتي تُنفّذ وظائف بايثون عند التفاعل معها. ومع ذلك، تجدر الإشارة إلى أنها، كونها مبنية على WebAssembly، قد يستغرق وقت التحميل الأولي وقتاً طويلاً. وقد يتأثر الأداء على الأجهزة المحمولة.
بريثون: ترجمة بايثون إلى جافا سكريبت

إذا كنا نبحث عن بديل أخف من حيث الحمل، فإن Brython خيار كلاسيكي. على عكس PyScript، فإن Brython عبارة عن تطبيق Python 3 مكتوب بالكامل بلغة JavaScript. ترجمة كود بايثون حتى يتمكن المتصفح من فهمها. ولكي تعمل، من الضروري استدعاء الدالة. brython() في هذا الحدث onload من نص HTML.
يتميز برنامج Brython بقدرته على التفاعل مع عناصر HTML وSVG. وذلك من خلال استخدام الكائن documentممكن إدخال المحتوى ديناميكيًا أو ارسم أشكالًا هندسية على لوحة SVG باستخدام عوامل تشغيل مخصصة مثل =< لإضافة عُقد إلى شجرة المستند. على الرغم من تعدد استخداماته، إلا أنه له قيود: لا يدعم جميع الوحدات من المكتبة القياسية ويتطلب معالجة إدخال البيانات وإخراجها من خلال عناصر HTML، لأن print() o input() إنها لا تعمل بالطريقة التقليدية.
تطبيقات ومقارنات أخرى

النظام البيئي واسع النطاق، ويضم مشاريع أخرى مثيرة للاهتمام. فمن جهة، هناك Skulpt الذي يدعم Python 2 و3 عبر JavaScript، وTranscrypt الذي يعمل كمترجم إلى JavaScript، مع أن الأخير يبدو أنه قد طواه النسيان. ومن جهة أخرى، هناك VistaPython الذي يقترح منهجًا مختلفًا باستخدام مترجم بايت كود مكتوب بلغة JavaScript ومحلل نحوي مُولّد باستخدام Antlr، مما يُسهّل الترقية إلى إصدارات أحدث من Python.
بمقارنة الأساليب، نلاحظ أن Brython وSkulpt يستخدمان محللات يدوية يصعب صيانتها. في المقابل، يُعد Pyodide (أساس PyScript) نقلًا حقيقيًا لـ CPython إلى WebAssembly، مما يضمن توافقًا أكبر بكثير، وإن كان ذلك على حساب حجم حزمة أكبر بكثير للتنزيل. أما VistaPython، فيسعى إلى تحقيق توازن بين المرونة والحجم ، من خلال تحسين ملفات تعريف التحميل لضمان تشغيل التطبيقات بسرعة على أي جهاز.
الأساليب التقليدية والبرمجيات الخلفية
ليس بالضرورة أن يتم كل شيء داخل المتصفح. بالنسبة للكثيرين، تظل الطريقة الأكثر فعالية لدمج لغة بايثون ولغة HTML هي استخدام... أطر عمل الخوادم مثل Flask في بايثون أو جانغوفي هذا المخطط، يتولى بايثون معالجة المنطق على الخادم ويرسل HTML المُعالَج إلى العميل، أو يعمل كـ REST API يقوم هذا البرنامج بتبادل البيانات بتنسيق JSON مع واجهة أمامية مكتوبة بلغة JavaScript باستخدام fetch o axios.
توجد أيضًا طرق أقدم مثل CGI (واجهة البوابة العامة)، والتي على الرغم من اعتبارها الآن قديمة نظرًا لتعقيدها، إلا أنها شكلت أساس الويب الديناميكي. بالنسبة لمن يحتاجون فقط إلى عرض البيانات، يُعد تحويل دفاتر Jupyter إلى HTML أسرع طريقة لنشر التقارير الفنية دون تعقيدات تقنية.
المحرك الذي يقف وراء كل ذلك: WebAssembly
يكمن السر الحقيقي الذي مكّن لغات برمجة مثل بايثون وسي++ وراست من الوصول إلى الويب في تقنية WebAssembly (Wasm). يتيح هذا المعيار المفتوح تنفيذ التعليمات البرمجية الثنائية بأداء يكاد يضاهي الأداء الأصلي. وبفضل Wasm، تمكنت شركات مثل أدوبي من نقل برنامج فوتوشوب إلى الويب ، كما حسّنت برامج أوتوكاد وفيجما بشكل كبير من تحميل البيانات ومعالجتها.
إن القدرة على تشغيل بايثون على جهاز العميل، سواء من خلال ترجمة Brython أو قوة PyScript الثنائية، تفتح عالماً من الإمكانيات لإنشاء أدوات وتطبيقات علوم البيانات المعقدة دون أن يضطر المستخدم إلى تثبيت أي شيء على جهاز الكمبيوتر الخاص به، مما يجعل الوصول إلى البرمجة المتقدمة أمراً ديمقراطياً.
لقد تطور دمج لغة بايثون على الويب من مجرد نصوص برمجية بسيطة من جانب الخادم إلى تنفيذ ثنائي عبر WebAssembly، مما يسمح لك بالاختيار بين الترجمة الخفيفة إلى جافا سكريبت باستخدام Brython أو القوة الكاملة لـ PyScript و Pyodide، وبالتالي تغيير الطريقة التي نتصور بها تطوير الواجهة الأمامية.