حتى الآن ، يعد عنصر HTML “iframe” أحد المكونات الأكثر استخدامًا لعرض المحتوى من موقع آخر على صفحة الويب الخاصة بنا. يسمح لك بدمج مستند ويب بأكمله في مستند آخر. ولكن ، يبدو أن إطارات iframe ، حتى إذا تم استخدامها بانتظام اليوم ، لم تعد شائعة كما ظهرت في برمجة الويب. هناك العديد من القيود على إطارات iframe وقد اقترحت Google بديلًا.

يحدد عنصر HTML “iframe” سياق تنقل متداخل مما يجعل من الممكن الحصول على صفحة HTML مدمجة في الصفحة الحالية. يسمى سياق التنقل الذي يحتوي على المحتوى المضمن “سياق التنقل الرئيسي”. لكل سياق تنقل تاريخه الخاص ووثيقة نشطة خاصة به. يمثل كل سياق تنقل تم إنشاؤه بواسطة عنصر iframe مستندًا في حد ذاته ، وبالتالي يمكن أن يزيد الموارد اللازمة لاستخدام الصفحة.

على سبيل المثال ، عند تصفح صفحة ويب ، قد يرى المستخدم عنصرًا يتوافق مع موقع آخر ، ولكن يتم دمجه في الصفحة التي يتواجد بها. تتمثل إحدى المزايا الكبيرة لإطار iframe في القدرة على تضمين المحتوى على الصفحة ، مع السماح لهذا المحتوى من موقع آخر بالاحتفاظ بالبرامج النصية والأنماط الخاصة به. هذا يسمح لك بالحصول على محتوى مستقل عن الصفحة التي تم إدراجه فيها. وبالتالي ، لن يكون للتفاعل مع العنصر في iframe أي تأثير على صفحة الويب. يوصى أيضًا باستخدام علامة iframe بشكل أساسي لهذا النوع من المحتوى.

ومع ذلك ، من الناحية النظرية ، على الرغم من أنه يمكنك إضافة أكبر قدر ممكن من إطارات iframe على العديد من المستويات كما تريد ، ضع في اعتبارك أنه يمكن أن يؤثر على أداء موقع الويب. ومع ذلك ، في السنوات الأخيرة ، يبدو أن عنصر iframe قد “خرج عن الموضة” وفقد جنون العديد من مطوري المجتمع وحتى شركات مثل Google. تم الاستشهاد بالعديد من العيوب اليوم فيما يتعلق باستخدام iframe. ويعتقد البعض ، على سبيل المثال ، أن التحميل بطيء وبالتالي يخلق تجربة مستخدم سيئة.

اقترحت Google في مؤتمر I / O العام الماضي استخدام علامات جديدة تسميها portal لاستبدال iframe. وفقًا لـ Google ، هذه واجهة برمجة تطبيقات جديدة لمنصة الويب تهدف إلى تسهيل تحميل صفحات الويب وتصفحها من خلال تبسيط تجربة تصفح المستخدم على موقعك. وكتبت جوجل في وثيقة تفسيرية للمشروع “نأمل أن تتمكن Portals API من معالجة بعض هذه المخاوف مع توفير ميزة قوية أخرى لمطوري الويب”.

وتم تصميم Portals API للسماح بالتنقل السلس بين المواقع أو الصفحات. على وجه الخصوص ، وسيسمح هذا للصفحة بعرض صفحة أخرى كإدخال وإجراء انتقال سلس بين حالة الإدراج والحالة التي تم اجتيازها. بعبارة أخرى ، توضح Google أن الهدف من “البوابات” هو تحسين التنقل من خلال توفير انتقالات أسرع وأكثر سلاسة على الويب ، مع الحفاظ على خصوصية المستخدم. سيتم استخدام Portals API من خلال علامات portal جديدة.

تشير Google إلى أن هذه العلامات قد تحل محل علامات iframe في المستقبل ، وهي المعيار القياسي اليوم لتضمين المحتوى أو دمج صفحات الويب معًا. “قبل علامات portals ، كان بإمكاننا تقديم صفحة أخرى باستخدام iframe. يمكننا أيضًا إضافة رسوم متحركة لتحريك الإطارات في صفحات معينة. ولكن باستخدام علامة iframe ، ليس لديك خيار التنقل في محتواه. قالت Google إن علامات portals تملأ هذه الفجوة ، مما يسمح بحالات استخدام مثيرة للاهتمام “. بالنسبة لعملاق البحث ، تعاني علامات iframe من عيوب ضخمة.

تشارك PayPal ، خدمة الدفع عبر الإنترنت ، نفس رأي Google. ومع ذلك ، لا يرغب PayPal في استبدال عنصر HTML iframe. بدلا من ذلك ، تريد الشركة تحسينه. قام مهندسو PayPal بتطوير “Zoid” ، مكتبة JavaScript رسومية ، لتكملة أداء iframe. وفقًا لدانيال برين Daniel Brain ، مهندس في PayPal ، تضيف Zoid ميزات مثيرة للاهتمام إلى إطارات iframe ، وهنا بعض منها.

يسمح Zoid بما يلي:

• بعرض إطار iframe أو نافذة منبثقة من مجال وإرسال الأشياء والوظائف ؛
• بإضافة عرض مسبق لتجنب تصور العرض البطيء: توفر Zoid أيضًا آليات العرض المسبق بتنسيق HTML و CSS في إطارات iframe والنوافذ المنبثقة ، بحيث يمكنك على الأقل عرض أداة تحميل ، أو ربما أن يكون شيئًا أكثر تقدمًا ، بينما تقوم النافذة الجديدة بتحميل محتواها ؛
• بالانتقال من داخل iframe إلى أجزاء أخرى من صفحة الويب التي تستضيفها (تشبه إلى حد ما Google API ) ؛
• بعرض مكوناتك التي تم إنشاؤها باستخدام React أو Vue.js أو Angular بسرعة أكبر: لم يتم تصميم Zoid لإنشاء مكونات لموقعك. للقيام بذلك ، تحتاج إلى استخدام مكتبات المكونات الأصلية مثل React. Zoid تجعل هذه المكونات تظهر بسرعة على صفحتك ؛
• بمشاركة الوظائف مع مواقع أخرى ، والتي لا يمكنك مشاركة مكونات JavaScript الأصلية معها ؛
• إلخ

وفقًا لـ PayPal ، لم يتم تصميم Zoid لاستبدال المكتبات مثل React ، المسؤولة عن تقديم المكونات من نفس المجال. شرح مهندسو الشركة أنه في الواقع ، فإن العرض الحقيقي الوحيد الذي تقوم به Zoid هو إطارات iframe والنوافذ المنبثقة. الباقي متروك لك. يمكنك بناء مكوناتك باستخدام أي إطار عمل أو مكتبة أو نمط من اختيارك ، ثم استخدم Zoid لإظهار مكوناتك عبر المجالات. يجب أن تعمل بشكل جيد مع أي إطار آخر.

ومع ذلك ، يدرك مهندسو PayPal جيدًا وجود أوجه قصور. وفقًا لتفسيرات دانيال برين ، هناك بعض المشكلات التي لا يمكن لمكتبة جافا سكريبت بسيطة حلها. ويبقى السؤال المطروح : ما هي الطريقة أو العلاج الذي توصي به لحل المشاكل المختلفة التي يثيرها iframe؟ هل يجب أن نتبع Google عن طريق استبدال iframe أم يجب أن نحاول تحسينها كما يقترح مهندسو PayPal؟

المصدر : zoid