أصبحت سرعة التطور التي تعيشه البشرية في أيامنا هذه، مخيفةً إلى حدٍّ جعل من غير المقبول التراجع أو التباطؤ في هذا التطور. ولعل أبرز ما يميز هذه المرحلة هو بروز شبكة الوب حاضناً أساسياً لا يمكن تجاهله، على الرغم من التحديات والمشكلات التي رافقت ظهوره، ومازالت ترافقه لاسيما من حيث الأداء. يهدف البحث إلى عرض المشكلات الحالية التي تواجه الأنظمة الحاسوبية العاملة على شبكة الوب من حيث الأداء، وأنظمة التخاطب مع المستخدم. ويطرح قائمة التحديات التي تواجهها، وذلك من خلال تقسيم المشكلات بناء على أنواع التقنيات البرمجية المستخدمة في بناء صفحات الوب. كما يعرض البحث مجموعة من النصائح والتحسينات المقترحة لرفع أداء هذه النظم إلى الحد الأمثل. وقد تم اختيار نظام المفاضلة في وزارة الصحة في الجمهورية العربية السورية، بيئة للاختبار وتطبيق النصائح والتوصيات. In today’s world, the development aspects are growing very fast. We must acknowledge the fact that we have to be as faster as this development. One of the major properties of today’s evolving is the World Wide Web which has the focus as a main container for the remaining properties. Since its beginning, the World Wide Web is facing a lot of difficulties and challenges such like the performance issues. This essay aims to state all of the current performance difficulties that are facing web-based computer systems. This can be done through dividing those difficulties according to the technology that was used in the web. Moreover, we demonstrate a number of suggestions and improvements that may increase the web performance in order to reach its ideal usage. In addition, those suggestions will be implemented in a real use case, and we chose the “Mofadalah” web-based system at the ministry of health in Syrian Arab Republic as an environment for our use case.

1. ‫دراسة الطرق المثلى لتحسين أداء تطبيقات الوب‬
‫إشراف د. باسل الخطيب‬
‫تقديم محمد القواص‬

3. External Objects

4. ‫القضايا األساسية حول مشاكل بطء الوب!!؟‬

5. ‫عدم رضى الزبون‬
‫تحميل الصفحة استغرق أكثر من 01 ثوان‬

6. ‫التأثير السلبي على أرباح الشركات‬

7. Google
0.4 sec for 10 Results
0.9 sec for 30 Results

8. 20% Drop in full-page trafic

9. Amazon
+100 ms
1% drop in sales

10. ‫عدد مستخدمي الموقع‬
‫>= ‪More than 8 sec‬‬

11. ‫االنطباع األولي للزبون‬
1/20 sec 10 sec, Noam Tractinsky

12. ‫نمو حجم صفحة الوب‬
‫‪2003 till now 3.3x‬‬

13. ‫وقت االستجابة األعظمي‬
‫• 2 إلى 3 ثوان‬
‫• 3 إلى 5 ثوان‬
‫• 02 إلى 03 ثانية‬

14. ‫التحسينات المقترحة ألداء صفحات الوب‬

15. ‫التحسينات المقترحة على مستوى صفحة الوب‬

16. ‫التقليل من عدد الطلبات الصادرة عن ‪HTTP‬‬

17. ‫التقليل من عدد الطلبات الصادرة عن ‪HTTP‬‬
‫تحويل النصوص الصورية إلى نصوص نمطية‬ ‫•‬
‫استخدم ‪Text Overlays‬‬ ‫•‬
‫تحويل ‪ spacer cells‬إلى (‪ CSS margins‬أو ‪)Padding‬‬ ‫•‬
‫دمج الصور و اسخدام ‪ Image map‬أو ‪Sprite‬‬ ‫•‬

18. ‫التقليل من عدد الطلبات الصادرة عن ‪HTTP‬‬
‫• دمج و تحسين ملفات ‪ CSS‬و ‪JavaScript‬‬
‫• تخزين الملفات الديناميكية في ‪Cache‬‬
‫• التخلص من ‪ (i)Frames‬و ‪javaScript includes‬‬

19. ‫تغيير حجم الصور وتحسينها‬

20. ‫تحسين الملتيميديا‬

21. ‫تحسين الملتيميديا‬
‫• تحسين الفيديو من أجل الوب‬
‫• معدالت وأبعاد إطار الفيديو‬
‫– 21 إلى 51 ‪fps‬‬
‫– 023 ‪pixels 240 x‬‬
‫• التقليل من الضجيج والحركة‬

22. ‫تحسين الملتيميديا‬
‫• تعديل الفيديو‬
‫– ضغط الفيديو من أجل الوب‬
‫– تقليل ‪ Video Noise‬باستخدام ‪Filters‬‬
‫– تعديل المباينة في اللون‬
‫– تعديل مستوى ‪gamma‬‬
‫– استعادة األسود واألبيض‬
‫– اختيار أفضل أنواع الكودك لتتماشى مع نوع العمل المراد فعله.‬

23. ‫تحويل ‪ JavaScript‬إلى ‪ CSS‬قدر اإلمكان‬

24. ‫استخدام طريقة ‪Sniffing‬‬
‫من قبل المخدم ‪Server-Side‬‬

25. ‫تحويل التخطيط الجدولي ‪Table Layout‬‬
‫إلى التخطيط المتعلق بـ ‪CSS‬‬

26. CSS ‫ بقواعد‬Inline Style ‫تبديل‬

27. ‫ بحكمة‬JavaScript ‫تشغيل‬

28. ‫تعريف ‪ CSS‬في أعلى الصفحة‬
‫والـ ‪ Javascript‬في أسفلها‬

29. ‫التحسينات المقترحة على مستوى ‪CSS‬‬

30. ‫استخدام المنتقيات التنازلية‬
‫};‪ul > li{font-weight:bold‬‬

31. ‫ مع التصاريح‬Selectors ‫تجميع المنتقيات‬
‫ المشتركة‬Declarations
.sitehead, .sitenav {
font-weight: normal; font-size: 12px; color: #0b2475; font-family: arial,
helvetica, sans-serif;
}

32. ‫تجميع التصاريح مع المنتقيات المشتركة‬
body {font-size: 1em;}
body {font-family: arial, helvetica, geneva, sans-serif;}
body {color:#000000;}
body {background:#ffffff;}

33. ‫دمج التنسيقات المتشابهة داخل صفوف ‪classes‬‬
‫مشتركة‬

34. ‫استخدام خاصية الوراثة ‪ Inheritance‬للتخلص من‬
‫التصاريح المتكررة‬

35. ‫استخدام صيغ ‪ CSS‬المختزلة‬

36. ‫ المختزلة‬CSS ‫استخدام صيغ‬
‫• استخدام ألوان مختزلة‬
color: #fc0; –
Shorthand Properties ‫• الخاصيات المختزلة‬
border: <border-width> <border-style> <color> –
transparent

37. ‫ الطويل‬class‫ و‬ID ‫اختصار أسماء التعريف‬
#c .ta{text-align:center;}

38. CSS3 ‫ و‬CSS2 ‫االستفادة من ميزات‬
[att]•
[att=val]•
[att~=val]•
[att |=val]•
transition: width 2s;•

39. ‫التحسينات المقترحة على مستوى ‪Javascript‬‬

40. ‫حذف تعليقات من ملف ‪Javascript‬‬

41. ‫التقليل من التعليقات الظرفية‬
<!--[if lt IE 7]><script src="patch.js"
type="text/javascript"></script><![endif]-->

42. ‫تقليل المساحات البيضاء‬

43. ‫استخدام اختزاالت ‪JavaScript‬‬
‫;++‪x=x+1; => x‬‬

44. ‫ الثابتة‬string ‫استخدام مختصرات‬
msg="An error has occurred";

45. ‫تجنب كتابة تعليمات مستحيلة التنفيذ‬

46. ‫تقصير أسماء المتحوالت والوظائف المعرفة من قبل‬
‫المستخدم‬

47. ‫القيم االفتراضية‬

48. ‫النظر في استخدام ‪ Ajah‬كحل بديل عن ‪ RSS‬و ‪JSON‬‬
‫و ‪XML‬عند الحاجة لها‬

49. ‫التحسينات المقترحة على مستوى ‪AJAX‬‬

50. ‫تطبيق ‪ AJAX‬بما يقابل المشكلة تماما‬

51. ‫استخدام مكتبة ‪ AJAX‬مدعمة وذات تصميم جيد‬
‫َّ‬

52. ‫استخدام مكتبة ‪ AJAX‬مدعمة وذات تصميم جيد‬
‫َّ‬
‫• اتصاالت ‪AJAX‬‬
‫• تسهيالت في الوصول إلى العقد المطلوبة ‪... DOM‬‬
‫– )($‬
‫• تنظيم األحداث‬
‫• وظائف التسهيالت المرفقة‬
‫• التأثيرات المرئية‬

53. ‫التقليل من متطلبات طلب ‪HTTP‬‬
‫1.1 ‪ :HTTP‬ال يمكن إرسال أكثر من طلبين إلى المخدم‬
‫بآن معا ً من نفس المتصفح‬

54. ‫اختيار أنماط البيانات بشكل صحيح قبل اإلرسال‬

55. ‫توظيف ذاكرة وسطية خاصة‬

56. ‫التأكد من معالجة مشاكل أداء الشبكة‬
‫طبقة ثامنة فوق الطبقات السبع الخاصة بالبروتوكول‬

57. ‫التحسين من جانب المخدم ‪Server Side‬‬

58. ‫تحسين طرق التحميل المتوازية ‪Parallel‬‬
‫‪Downloads‬‬

59. ‫تقليل مقابالت ‪DNS lookups‬‬
‫يستغرق ‪ DNS‬عادة 02-021 جزء من الثانية‬

60. HTTP ‫ضغط‬
Gzip

61. Delta ‫تشفير‬

62. ‫إعادة كتابة عناوين المصادر على اإلنترنت ‪URIs‬‬
‫باستخدام تقنية ‪mod_rewrite‬‬

63. ‫نظام المفاضلة الكترونية في وزارة الصحة‬

64. ‫في هذه الحالة المواقع مصمم دون مراعاة قواعد تحسين األداء.‬
‫من المالحظ أن عدد ملفات ‪ Javascript‬هو 01 ملفات ‪CSS‬‬
‫هو 8، وعدد الطلبات هو 45 طلب، والحجم الكلي للملف‬
‫2.1 ميغا بايت، والزمن الكلي المستغرق 40.51 ثانية.‬

65. ‫وأصبح الحجم الكلي 1 ميغا بايت والزمن الكلي المستغرق‬
‫9.41 ثانية‬

66. ‫وأصبح عدد الطلبات 83 طلب والزمن الكلي المستغرق 50.9‬
‫ثانية‬

67. ‫آفاق مستقبلية‬

68. ‫آفاق مستقبلية‬
‫دراسة األداء لألنظمة العاملة على أجهزة النقالة‬ ‫•‬
‫دراسة األداء لتبادل البيانات بين األجهزة‬ ‫•‬
‫دراسة أداء األنظمة التي تدعم تطبيقات األجهزة النقالة‬ ‫•‬
‫تطوير نظام آلي يعتمد على البحث السابق ليساعد المطور‬ ‫•‬
‫على رفع من أداء نظامه‬