انتبه: Opera 10 لا يساوي Opera 1

مدرج تحت قسم: مقالات
16 فبراير 2009

يعود إلينا بنسخته التجريبية المتصفح الشهير Opera بنسخته الجديدة 10 والتي كسر بها الأرقام القياسية، حيث أنه أول متصفح موجود لحد الآن يصل إلى نسخة مكونة من رقم عشاري، حيث نجد أقرب المنافسين لهذا الرقم هو متصفح Internet Explorer بالنسخة الثامنة والتي مازالت تحت التجريب أيضا، وأنه من أوئل المتصفحات التي اجتازت وبامتياز اختبار ACID 3.

ومن بين الأشياء التي كسرها متصفح Opera الجديد هي المواقع التي تستهدف المتصفحات المعينة لتعرض ما يناسبها أو ما يسمى Browser Sniffing، حيث يشير Andrew Gregory إلى العادات البرمجية السيئة التي يتبعها بعض مطوري الجافاسكربت لاستهداف المتصفحات لتفادي عيوبها في طريقة عرض المحتويات، لنأخذ على سبيل المثال الطريقة التي طرحها Andrew والمنتشرة جدا في المواقع:

if (navigator.userAgent.toLowerCase().indexOf('opera') != -1)
{
	isOpera = true;
	i = navigator.userAgent.indexOf('Opera') + 6;
	v = parseInt(navigator.userAgent.substring(i, i+1));
	if(v < 7)
		isOperaOld = true;
}


حيث في قراءة سريعة ستجد أن هذا الكود يرى أولا هل المتصفح هو Opera؟ إن كان الجواب بنعم يقوم بأخذ أول رقم بعد الكلمة “Opera” ويترك كل الباقي ويقوم بمقارنته مع الرقم 7. وبما أن 1 أصغر من 7 إذا المتصفح الجديد “قديم” بنظر مطور الجافاسكربت.

الكل يعلم أن كل متصفح له عيوبه سواء كان في طريقة عرض HTML، معالجة Javascript، أو تحليل CSS، وللتغلب على مشكلة كل متصفح لجأ المطورون إلى استخدام هذه الطرق لاستهدافها والتغلب على هذه المشاكل، ولكن لا يجب علينا أن نعالج الخطأ بخطأ أكبر منه، هناك الكثير من الطرق والأساليب للتغلب على مشاكل المتصفحات وبالأخص مشاكل الجافاسكربت، ومن هذه الطرق هي اصطياد العيوب الموجودة في تلك المتصفحات ومن ثم ايجاد حل آخر بديل. أعني بكلامي هذا هو عدم استهداف المتصفح بعينه أو نسخه بعينها وإنما استهداف العيب أو القصور فيها وايجاد طريقة أخرى لحلها، على سبيل المثال لنأخذ كود بسيط وهو إنشاء XMLHTTPRequest أو ما يعرف AJAX:

function createXMLHTTPRequest () {
	var xmlhttp=false;
	try {
		xmlhttp = new ActiveXObject('Msxml2.XMLHTTP');
	} catch (e) {
		try {
			xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
		} catch (E) {
			xmlhttp = false;
		}
	}
	if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
		xmlhttp = new XMLHttpRequest();
	}
	return xmlhttp;
}

نرى أننا نستخدم بعض الطرق لايجاد كائن XMLHTTPRequest عن طريق جمل try() وcatch() أي إن لم ينفع مثلا ActiveXObject(”Msxml2.XMLHTTP”) نرى إن كان ينفع ActiveXObject(”Microsoft.XMLHTTP”) وإن لم تنفع الطرق نذهب إلى الدالة XMLHttpRequest()، بهذه الطريقة لم نستهدف المتصفح وإنما استهدفنا العيب في المتصفح، الفائدة الكبيرة هنا هي في المستقبل وعندما يتطور المتصفح أكيد سينحل هذا العيب وبالتالي لن يتأثر الموقع.

المشكلة الكبيرة هنا أن المستخدم العادي لا يعرف هذه المعلومات، لذا وعندما يجرب متصفح Opera 10 ويرى أن بعض المواقع لا تعمل بالشكل المطلوب، يلوم المتصفح المسكين بينما الملام هنا يجب أن يكون المطور، وهذا يذكرني بقصة انتشار متصفح Firefox وكيف كانت (وللأسف لازالت) الناس تلومه لأنه يتبع المقاييس العالمية.

عن الكاتب

عبدالرحمن العتيبة أحد مؤسسي ورئيس التحرير في موقع المشروع، يهوى برمجة وتطوير الويب بكافة أنواعها، وله خبرة تتعدى 10 سنوات في هذا المجال، يعتبر نفسه من "أشد" مناصري المصادر المفتوحة، وأنها "في يوم ما" ستقضي على كل برنامج محتكر ومغلق مصدره. يعتقد بوجود القمر، ولكنه للأسف لم يصل إليه إلى الآن. يمكنك متابعته على twitter وعلى مدونته.

  • Share/Bookmark

التعقيبات

  1. المدون الضيف: تحسين طباعة الروابط | Css | الدكتور نت | الدكتور نت

التعليقات (3) على ”انتبه: Opera 10 لا يساوي Opera 1“

  1. معلومات رائعة و دروس أروع من هذا الموقع الرائع

    جزاكم الله خيرا ً

  2. جزاك الله خيراً أستاذى عبدالرحمن العتيبة
    دائماً ما تتحفنا بمقالات مفيده :)
    تحيتى لك

  3. =)

    السـَلام عليكم ،،
    أشكرك على دروسك ومقالتك الـِرائعه أستاذ عبدالرحمنّ ،،
    الله يجزآك خَير عَليهآا ..
    وحبيت أسألك شي عنّ اوبرا واتمنى القى الإفأده عندك ..
    اشلون اخلي الارقـَام تظهر لي بمتصفح اوبرا عربي .!!
    بعض الصفحآت لما استعرضها بآكسبلور تظهر الارقـَام عربي في الصفحه لكن لما افك نفس الصفحه بأوبرا تظهر لغة أنجليزية .!!

    :( هل في حَل لتعديلها ..؟

أضف تعليقك




يمكنك استخدام الوسوم التالية في التعليق: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>


* حقول مطلوبة