اختر صفحة

Knockout.js ، المعروف باسم KnockoutJS أو Knockout أو ببساطة KO ، هو مكتبة جافا سكريبت مستقلة مفتوحة المصدر تعتمد على نمط Model-View-ViewModel (MVVM) الذي يساعد المطورين على إنشاء مواقع ويب حديثة وديناميكية. قام ستيف ساندرسون ، وهو مطور / مهندس معماري في Microsoft ، بإنشائه في 5 يوليو 2010. نظرا لأنه ينفذ نمط MVVM ، يقوم Knockout بتعيين أدوار متميزة بين البيانات المعروضة (واجهة المستخدم) ومكونات العرض (نماذج تمثيل JavaScript) وبيانات المجال (البيانات المخزنة) من خلال تحديد طبقة من التعليمات البرمجية التي تدير السلوك بين مكونات العرض بوضوح. هذا يسلط الضوء حقا على قدرات جافا سكريبت لإدارة الأحداث الأصلية لأنه يبسط الطريقة التي تتفاعل بها المكونات مع بعضها البعض.

بعض الميزات الأكثر صلة التي تقدمها Knockout هي الربط التعريفي ، والتحديث التلقائي لواجهة المستخدم ، وتتبع التبعية ، واستخدام القوالب وقابلية التوسعة. يربط KO النماذج ب DOM من خلال سمة ربط البيانات ، مما يساعد على عرض البيانات بطريقة أكثر ديناميكية وإثراء تجربة المستخدم. تساعد التحديثات التلقائية على تحديث DOM الخاص بمستعرض الويب إذا كان هناك تغيير في بيانات النموذج دون الحاجة إلى كتابة تعليمات برمجية إضافية. يراقب تتبع تبعية Knockout سمات KO ويقوم بتحديثها تلقائيا من خلال الاستفادة من وظائف مكتبة Knockout. علاوة على ذلك ، تساعد ميزات Knockout التجريبية في بناء واجهات مستخدم قوية بطريقة بسيطة ومريحة ، والتي يمكن أن تساعد في توسيع السلوكيات المخصصة في النهاية. يتم دعم Knockout في جميع متصفحات الويب الرئيسية مثل Google Chrome و Firefox.

 

مشكلات الأداء الشائعة في خروج المغلوب

قدم Knockout 2.0 ميزة أنيقة تسمى ربط تدفق التحكم ، والتي تضيف طبقة تحكم إلى ربط القالب. تستخدم الطبقة مكونات فرعية كقالب لها وتعيد عرضها في كل مرة يتم تشغيلها فيها. ومع ذلك ، يجب أن يكون المطورون واعين لعدم استغلال هذا المورد بشكل مفرط وبدون تخطيط.

عادة ، يواجه مطورو

Knockout مكونات يتم تقديمها بشكل متكرر باستخدام إذا

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

 

أدوات الأداء لزيادة وقت التحميل

لسوء الحظ ، لا توجد أداة أداء مخصصة في متجر إضافات Chrome ل KnockoutJS ، قادرة على تراكب إحصائيات الأداء عبر واجهة المستخدم. لذلك ، يتعين على مطوري Knockout استخدام موارد أخرى لتصور وتحديد مشكلات الأداء المحتملة.

 

أدوات تطوير Chrome والمنارة

أدوات تطوير Chrome هي مجموعة من أدوات تطوير الويب التي يمكنها مساعدة مطوري البرامج في جميع أنواع مشكلات تشخيص الويب وتصحيح الأخطاء. الفائدة هي أن الأدوات مبنية داخل المتصفح ، مما يساعد المطورين على العثور على الأخطاء وإصلاحها بسرعة. باستخدام إضافة مضمنة لتطبيقات Knockout، يمكن أن تساعد أدوات DevTools من Chrome في إظهار كيفية تحميل عناصر أو مكونات معينة وعرضها كما قد يختبرها المستخدم. يمكن للمطورين تسجيل جلسة من تطبيقاتهم لقياس أفضل لمكان أي اختناقات في الأداء ويتم عرض النتائج في شريط جانبي منفصل. هذا مهم بشكل خاص عند محاولة تشخيص أوقات التأخر داخل نماذج العرض الكبيرة.

Lighthouse هي أداة مفتوحة المصدر ضمن مجموعة أدوات Chrome DevTools التي تساعد على تشخيص وإصلاح بعض جوانب الأداء لصفحات الويب والتطبيقات ، مثل إمكانية الوصول وتحسينات تحسين محركات البحث لمواقع الويب. لدى Lighthouse أيضا القدرة على اختبار PWAs (تطبيقات الويب التقدمية) التي تم إنشاؤها باستخدام KnockoutJS ، على سبيل المثال. تعمل الأداة عن طريق اختبار سرعة تحميل الصفحة ثم إعداد التقارير مرة أخرى مع الإصلاحات المقترحة. هناك مقياسان رئيسيان هما مؤشر السرعة الإدراكية ، والذي يتم تعريفه من خلال الوقت (بالمللي ثانية) الذي يستغرقه عرض الأقسام المرئية لصفحة الويب ، و Estimated Input Latency ، والذي يبدو كما يبدو ، هو الوقت المقدر الذي تستغرقه صفحة الويب أو التطبيق للرد على مدخلات المستخدم أثناء تحميل الصفحة أو التطبيق.

 

تحسين أداء تطبيق Knockout باستخدام LoadView

يستخدم LoadView مسجل الويب EveryStep ، وهي أداة برمجة نصية للنقطة والنقر تقوم بتكرار التفاعلات من جانب العميل لمواقع الويب وتطبيقات الويب لتقييم السيناريوهات المعقدة. أداة البرمجة النصية القوية هذه قادرة على محاكاة عمليات المستخدم المعقدة مثل نقرات الماوس ، والحوافر ، والحركات ، والتحقق من الصور والنصوص ، واختيارات القائمة ، وأكثر من ذلك بكثير. يمكن بعد ذلك تحميل البرامج النصية إلى LoadView ، حيث يمكن للمستخدم الاختيار من بين سيناريوهات اختبار متعددة ومواقع جغرافية والعديد من الميزات الأخرى.

موقع KnockoutJS

 

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

 

مخطط انحداري

 

الاستنتاج: تطبيقات اختبار الحمل مكتوبة بالضربة القاضية.js

لا تحظى .js بالضربة القاضية بما يكفي من الأضواء ، كما يفعل منافسوها. ومع ذلك ، فإن طبيعتها خفيفة الوزن ومدى سهولة تدفق البيانات بين الطبقات تساعد المطورين على بناء التطبيقات بشكل أسرع وبقاعدة صلبة. مع تزايد صعود تطبيقات الويب والحاجة إليها ، لا يمكنك الاعتماد فقط على إطار Knockout لضمان الأداء المتسق. يحتاج المطورون إلى التأكد من أن تطبيقاتهم يمكن أن تعمل ضد طفرات كبيرة من حركة المرور ، ويجب استخدام أداة مثل EveryStep Web Recorder جنبا إلى جنب مع حل LoadView لتشخيص اختناقات الأداء بفعالية والسيناريوهات التي يمكن أن تؤثر فيها المهام المخفية على وقت استجابة التطبيق وتجربة المستخدم.

ابدأ الإصدار التجريبي المجاني من LoadView واحصل على 20 دولارا في أرصدة اختبار التحميل لبدء اختبار تطبيق Knockout الخاص بك! أو إذا كنت ترغب في الحصول على جولة كاملة في منصة LoadView ، فقم بالتسجيل للحصول على عرض توضيحي مباشر مع أحد مهندسي الأداء لدينا. سوف يأخذونك خطوة بخطوة خلال عمليات البرمجة النصية والإعداد والاختبار ، بالإضافة إلى الإجابة على أي أسئلة حول اختبار الأداء قد تكون لديك.