نظرة عامة

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

شعار Lighthouse

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

يمكنك أيضًا استخدام Lighthouse CI لمنع التراجع على مواقعك الإلكترونية.

يمكنك مشاهدة الفيديو أدناه من مؤتمر Google I/O لمعرفة مزيد من المعلومات حول كيفية استخدام Lighthouse والمساهمة فيه.

البدء

اختَر سير عمل Lighthouse الذي يناسبك على أفضل وجه:

تشغيل Lighthouse في "أدوات مطوري البرامج في Chrome"

يتضمّن Lighthouse لوحة خاصة به في "أدوات مطوّري البرامج في Chrome". لعرض تقرير:

  1. نزِّل Google Chrome للكمبيوتر المكتبي.
  2. في Google Chrome، انتقِل إلى عنوان URL الذي تريد تدقيقه. يمكنك تدقيق أي عنوان URL على الويب.
  3. افتح "أدوات مطوري البرامج في Chrome".
  4. انقر على علامة التبويب مصباح الهداية.

    لوحة Lighthouse في "أدوات مطوّري البرامج في Chrome"
    يظهر على اليمين إطار عرض الصفحة التي سيتم تدقيقها. على يسار الصفحة، تظهر لوحة Lighthouse في "أدوات مطوري البرامج" في Chrome، والتي تدعمها أداة Lighthouse

  5. انقر على تحليل تحميل الصفحة. تعرِض لك أدوات المطوّرين قائمة بفئات التدقيق. اتركها جميعًا مفعَّلة.

  6. انقر على تنفيذ التدقيق. بعد مرور 30 إلى 60 ثانية، تقدّم لك أداة Lighthouse تقريرًا عن الصفحة.

    تقرير Lighthouse في "أدوات مطوّري البرامج في Chrome"
    تقرير Lighthouse في "أدوات مطوري البرامج في Chrome"

تثبيت أداة سطر أوامر Node وتشغيلها

لتثبيت وحدة Node:

  1. نزِّل Google Chrome للكمبيوتر المكتبي.
  2. ثبِّت إصدار الدعم الطويل الأمد الحالي من Node.
  3. ثبِّت Lighthouse. وتؤدي العلامة -g إلى تثبيتها كوحدة عالمية.
npm install -g lighthouse

لإجراء عملية تدقيق:

lighthouse <url>

للاطّلاع على جميع الخيارات:

lighthouse --help

تشغيل وحدة العقدة آليًا

راجِع قسم الاستخدام آليًا للاطّلاع على مثال لتشغيل Lighthouse آليًا كوحدة عقدة.

تشغيل "إحصاءات PageSpeed"

لتنفيذ Lighthouse في "إحصاءات PageSpeed":

  1. انتقِل إلى إحصاءات PageSpeed.
  2. أدخِل عنوان URL لصفحة ويب.
  3. انقر على تحليل.

    واجهة مستخدم &quot;إحصاءات PageSpeed&quot;
    واجهة مستخدم "إحصاءات PageSpeed"

تشغيل Lighthouse كإضافة في Chrome

لتثبيت الإضافة، يُرجى اتّباع الخطوات التالية:

  1. نزِّل Google Chrome للكمبيوتر المكتبي.
  2. ثبِّت إضافة Lighthouse في Chrome من "سوق Chrome الإلكتروني".

لإجراء عملية تدقيق:

  1. في متصفِّح Chrome، انتقِل إلى الصفحة التي تريد تدقيقها.
  2. انقر على منارة امتداد المنارة. من المفترض أن يظهر بجانب شريط العناوين في Chrome. إذا لم يكن الأمر كذلك، افتح قائمة إضافات Chrome ويمكنك الوصول إليها من هناك. بعد النقر، يتم توسيع قائمة Lighthouse.

    إضافة Lighthouse
    لوحة إضافة Lighthouse

  3. انقر على إنشاء تقرير. تُجري أداة Lighthouse عمليات التدقيق على الصفحة التي يتم التركيز عليها حاليًا، ثم تفتح علامة تبويب جديدة تحتوي على تقرير بالنتائج.

    تقرير إضافات Lighthouse
    تقرير Lighthouse من الإضافة

مشاركة التقارير وعرضها على الإنترنت

يمكنك استخدام Lighthouse Viewer لعرض التقارير ومشاركتها على الإنترنت.

أداة عرض Lighthouse
The Lighthouse Viewer

مشاركة التقارير كملف JSON

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

  • تقرير Lighthouse: افتح القائمة رمز القائمة في أعلى يسار الصفحة وانقر على زر الحفظ بتنسيق JSON حفظ بتنسيق JSON.
  • سطر الأوامر: التشغيل: shell lighthouse --output json --output-path <path/for/output.json>

لعرض بيانات التقرير:

  1. افتح Lighthouse Viewer.
  2. اسحب ملف JSON إلى "عارض الملفات"، أو انقر على أي مكان في "عارض الملفات" لفتح أداة التنقّل في الملفات واختيار الملف.

مشاركة التقارير كملفات Gist في GitHub

إذا كنت لا تريد مشاركة ملفات JSON يدويًا، يمكنك أيضًا مشاركة تقاريرك كخلاصات سرية على GitHub. من مزايا مقتطفات النص البرمجي إمكانية التحكّم في الإصدارات مجانًا.

لتصدير تقرير كسجلّ من التقرير:

  1. (إذا كنت في "عارض الملفات"، تخطّ هذه الخطوة) افتح قائمة رمز القائمة في أعلى يسار الصفحة، ثم انقر على زر &quot;فتح في العارض&quot; فتح في "عارض الملفات". يتم فتح التقرير في "العرض" في https://googlechrome.github.io/lighthouse/viewer/.
  2. في "العرض"، افتح قائمة رمز القائمة في أعلى يسار الشاشة، ثم انقر على زر الفتح في العارض حفظ بتنسيق Gist. في المرة الأولى التي تقوم فيها بذلك، تطلب نافذة منبثقة إذنًا للوصول إلى بياناتك الأساسية في GitHub، وقراءة سجلاتك والكتابة إليها.

لتصدير تقرير كخلاصة من إصدار CLI من Lighthouse، عليك إنشاء خلاصة يدويًا ونسخ ولصق إخراج JSON للتقرير في الخلاصة. يجب أن ينتهي اسم ملف Gist الذي يحتوي على إخراج JSON بالامتداد .lighthouse.report.json. راجِع مشاركة التقارير كملف JSON للاطّلاع على مثال عن كيفية إنشاء إخراج JSON من أداة سطر الأوامر.

لعرض تقرير تم حفظه كمرجع:

  • أضِف ?gist=<ID> إلى عنوان URL الخاص بالمُشاهد، حيث يكون <ID> هو رقم تعريف السجلّ. text https://googlechrome.github.io/lighthouse/viewer/?gist=<ID>
  • افتح العارض والصِق عنوان URL الخاص بسجلّ النقاط فيه.

إمكانية توسيع نطاق أداة Lighthouse

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

حِزم "تجميع"

ويستخدم مطوّرو البرامج العديد من التكنولوجيات المختلفة (أُطر عمل الخلفية أو نظام إدارة المحتوى أو JavaScript) لإنشاء صفحات الويب الخاصة بهم. بدلاً من عرض اقتراحات عامة فقط، يمكن لأداة Lighthouse الآن تقديم نصائح أكثر صلة وقابلة للتنفيذ استنادًا إلى الأدوات المستخدَمة.

"حزم المكدس" اسمح لأداة Lighthouse برصد النظام الأساسي الذي بني عليه موقعك الإلكتروني وعرض اقتراحات محدّدة مستندة إلى تسلسل استدعاء الدوال البرمجية. يحدّد الخبراء في المنتدى هذه الاقتراحات وينظّمونها.

للمساهمة بحزمة حِزم، يُرجى مراجعة إرشادات المساهمة.

مكوّنات Lighthouse الإضافية

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

لمزيد من المعلومات حول طريقة إنشاء المكوّن الإضافي الخاص بك، يمكنك الاطّلاع على كتيّب المكوّنات الإضافية في مستودع Lighthouse GitHub.

دمج Lighthouse

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

المساهمة في Lighthouse

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