Lighthouse هي أداة مبرمَجة ومفتوحة المصدر لتحسين جودة صفحات الويب. يمكنك تشغيله على أي صفحة ويب، سواء كانت علنية أو تتطلّب مصادقة. تتضمّن هذه الأداة عمليات تدقيق في الأداء وسهولة الاستخدام وتطبيقات الويب التقدّمية وتحسين محركات البحث والمزيد.
يمكنك تشغيل Lighthouse في "أدوات مطوري البرامج في Chrome" من سطر الأوامر أو كوحدة عقدة. أنت تمنح أداة Lighthouse عنوان URL للتدقيق فيها، وستجري سلسلة من عمليات التدقيق على الصفحة ثم ينشئ تقريرًا عن مدى جودة أداء الصفحة. بعد ذلك، استخدم عمليات التدقيق التي لم تجتَز عملية التدقيق كمؤشرات حول كيفية تحسين الصفحة. تحتوي كل عملية تدقيق على مستند مرجعي يوضح سبب أهمية التدقيق، بالإضافة إلى كيفية إصلاحها.
يمكنك أيضًا استخدام Lighthouse CI لمنع التراجع على مواقعك الإلكترونية.
يمكنك مشاهدة الفيديو أدناه من مؤتمر Google I/O لمعرفة مزيد من المعلومات حول كيفية استخدام Lighthouse والمساهمة فيه.
البدء
اختَر سير عمل Lighthouse الذي يناسبك على أفضل وجه:
- في "أدوات مطوّري البرامج في Chrome": يمكنك بسهولة تدقيق الصفحات التي تتطلّب المصادقة وقراءة تقاريرك بتنسيق سهل الاستخدام.
- من سطر الأوامر: يمكنك التشغيل الآلي لعمليات Lighthouse من خلال النصوص البرمجية لنظام التشغيل.
- كوحدة عقدة: دمج Lighthouse في أنظمة الدمج المستمر
- من واجهة مستخدم على الويب: يمكنك تشغيل Lighthouse والربط بالتقارير بدون تثبيت أيّ أدوات.
تشغيل Lighthouse في "أدوات مطوري البرامج في Chrome"
يتضمّن Lighthouse لوحة خاصة به في "أدوات مطوّري البرامج في Chrome". لعرض تقرير:
- نزِّل Google Chrome للكمبيوتر المكتبي.
- في Google Chrome، انتقِل إلى عنوان URL الذي تريد تدقيقه. يمكنك تدقيق أي عنوان URL على الويب.
- افتح "أدوات مطوري البرامج في Chrome".
انقر على علامة التبويب مصباح الهداية.
انقر على تحليل تحميل الصفحة. تعرِض لك أدوات المطوّرين قائمة بفئات التدقيق. اتركها جميعًا مفعَّلة.
انقر على تنفيذ التدقيق. بعد مرور 30 إلى 60 ثانية، تقدّم لك أداة Lighthouse تقريرًا عن الصفحة.
تثبيت أداة سطر أوامر Node وتشغيلها
لتثبيت وحدة Node:
- نزِّل Google Chrome للكمبيوتر المكتبي.
- ثبِّت إصدار الدعم الطويل الأمد الحالي من Node.
- ثبِّت Lighthouse. وتؤدي العلامة
-g
إلى تثبيتها كوحدة عالمية.
npm install -g lighthouse
لإجراء عملية تدقيق:
lighthouse <url>
للاطّلاع على جميع الخيارات:
lighthouse --help
تشغيل وحدة العقدة آليًا
راجِع قسم الاستخدام آليًا للاطّلاع على مثال لتشغيل Lighthouse آليًا كوحدة عقدة.
تشغيل "إحصاءات PageSpeed"
لتنفيذ Lighthouse في "إحصاءات PageSpeed":
- انتقِل إلى إحصاءات PageSpeed.
- أدخِل عنوان URL لصفحة ويب.
انقر على تحليل.
تشغيل Lighthouse كإضافة في Chrome
لتثبيت الإضافة، يُرجى اتّباع الخطوات التالية:
- نزِّل Google Chrome للكمبيوتر المكتبي.
- ثبِّت إضافة Lighthouse في Chrome من "سوق Chrome الإلكتروني".
لإجراء عملية تدقيق:
- في متصفِّح Chrome، انتقِل إلى الصفحة التي تريد تدقيقها.
انقر على منارة . من المفترض أن يظهر بجانب شريط العناوين في Chrome. إذا لم يكن الأمر كذلك، افتح قائمة إضافات Chrome ويمكنك الوصول إليها من هناك. بعد النقر، يتم توسيع قائمة Lighthouse.
انقر على إنشاء تقرير. تُجري أداة Lighthouse عمليات التدقيق على الصفحة التي يتم التركيز عليها حاليًا، ثم تفتح علامة تبويب جديدة تحتوي على تقرير بالنتائج.
مشاركة التقارير وعرضها على الإنترنت
يمكنك استخدام Lighthouse Viewer لعرض التقارير ومشاركتها على الإنترنت.
مشاركة التقارير كملف JSON
يحتاج "عارض Lighthouse" إلى إخراج JSON لتقرير Lighthouse. توضّح القائمة أدناه كيفية الحصول على ناتج JSON، بناءً على سير عمل Lighthouse الذي تستخدمه:
- تقرير Lighthouse: افتح القائمة في أعلى يسار الصفحة وانقر على حفظ بتنسيق JSON.
- سطر الأوامر: التشغيل:
shell lighthouse --output json --output-path <path/for/output.json>
لعرض بيانات التقرير:
- افتح Lighthouse Viewer.
- اسحب ملف JSON إلى "عارض الملفات"، أو انقر على أي مكان في "عارض الملفات" لفتح أداة التنقّل في الملفات واختيار الملف.
مشاركة التقارير كملفات Gist في GitHub
إذا كنت لا تريد مشاركة ملفات JSON يدويًا، يمكنك أيضًا مشاركة تقاريرك كخلاصات سرية على GitHub. من مزايا مقتطفات النص البرمجي إمكانية التحكّم في الإصدارات مجانًا.
لتصدير تقرير كسجلّ من التقرير:
- (إذا كنت في "عارض الملفات"، تخطّ هذه الخطوة) افتح قائمة في أعلى يسار الصفحة، ثم انقر على فتح في "عارض الملفات". يتم فتح التقرير في "العرض" في
https://googlechrome.github.io/lighthouse/viewer/
. - في "العرض"، افتح قائمة في أعلى يسار الشاشة، ثم انقر على حفظ بتنسيق 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.