مكونات طريقة التنفيذ – نظرة عامة

مكونات طريقة التنفيذ

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

المكوّنات

  • <howto-checkbox>: تمثل خيارًا منطقيًا في نموذج. النوع الأكثر شيوعًا من مربعات الاختيار هو النوع المزدوج الذي يسمح للمستخدم بالتبديل بين خيارين - محددين وغير محددين.
  • <howto-tabs>: فرض قيود على المحتوى المرئي من خلال تقسيمه إلى لوحات متعدّدة.
  • <howto-tooltip>: نافذة منبثقة تعرض معلومات ذات صلة بعنصر عندما يتلقّى العنصر تركيز لوحة المفاتيح أو عندما يمرر الماوس فوقه.

الأهداف

هدفنا هو توضيح أفضل الممارسات لكتابة مكونات قوية يمكن الوصول إليها وأداءها والمحافظة عليها وسهولة تصميمها. يعد كل مكون مستقلاً تمامًا بحيث يمكن أن يكون بمثابة تنفيذ مرجعي.

تسهيل الاستخدام

تتّبع المكونات بدقة ممارسات تأليف WAI ARIA، وهي دليل لشرح وعرض ARIA، وهو معيار تطبيقات الإنترنت الغنية بصريًا. إذا لم تكن معتادًا على استخدام ARIA، يمكنك الاطّلاع على مقدمتنا على WebFundamentals. ويضم كل مكوّن رابطًا إلى القسم ذي الصلة من "ممارسات الكتابة". رغم أنه ليس ضروريًا تمامًا، إلا أننا نوصي بقراءة قسم "ممارسات الكتابة" قبل التعمق في التعليمات البرمجية.

عروض أداء

في مجال تطوير الويب، يمكن تطبيق مصطلح "الأداء" على عدد كبير من العوامل. في سياق <howto>، يشير الأداء في الغالب إلى الصور المتحركة التي يتم تشغيلها باستمرار بسرعة 60 لقطة في الثانية، حتى على الأجهزة الجوّالة.

مرونة بصرية

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

رمز برمجي يمكن المحافظة عليه

نظرًا لأن طريقة التنفيذ: المكونات هي تنفيذ مرجعي، فقد أمضينا وقتًا إضافيًا في كتابة التعليمات البرمجية التي يمكن قراءتها وسهلة الفهم والتي يتم التعليق عليها بكثرة.

غير الأهداف

العمل على شكل مكتبة أو إطار عمل أو مجموعة أدوات

لا يتم نشر مكوِّنات <howto> على npm أو يحصل على مساحة قوس أو أي نظام أساسي آخر، لأنه ليس مصممًا للاستخدام في الإنتاج. للحصول على تعليمات برمجية مختصرة وقابلة للقراءة، نستخدم واجهات برمجة تطبيقات JavaScript الحديثة وندعم المتصفحات الحديثة التي تنفّذ معايير مكونات الويب. ستكون قادرًا على تكييف التعليمات البرمجية لتناسب احتياجاتك الخاصة بعد قراءة هذه التطبيقات.

التوافق مع الأنظمة القديمة

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

كن كاملاً

في الوقت الحالي، لا ننفّذ *جميع *المكوّنات التي يمكن العثور عليها في "ممارسات تأليف ARIA" في WAI. مع ذلك، إنّ إعادة استخدام المبادئ المستخدَمة في مكوّنات <howto> الأخرى يجب أن تتيح للقرّاء تنفيذ أي مكوّنات غير متوفّرة.