معرفی فانوس دریایی

Lighthouse یک ابزار متن باز و خودکار است که به شما در بهبود کیفیت صفحات وب کمک می کند. می توانید آن را در هر صفحه وب، عمومی یا نیاز به احراز هویت اجرا کنید. دارای ممیزی برای عملکرد، دسترسی، برنامه های وب پیشرو، سئو و موارد دیگر است.

می‌توانید Lighthouse را در Chrome DevTools، از خط فرمان یا به‌عنوان یک ماژول Node اجرا کنید. به Lighthouse یک URL برای ممیزی بدهید، یک سری ممیزی بر روی صفحه انجام می دهد، و سپس گزارشی از عملکرد خوب صفحه ایجاد می کند. از ممیزی های ناموفق به عنوان شاخصی برای بهبود صفحه استفاده کنید. هر ممیزی مرجعی دارد که دلیل اهمیت ممیزی و همچنین نحوه رفع آن را توضیح می دهد.

همچنین می توانید از Lighthouse CI برای جلوگیری از رگرسیون در سایت های خود استفاده کنید.

شروع کنید

گردش کار Lighthouse را انتخاب کنید که مناسب شما باشد:

• در Chrome DevTools . صفحاتی را که نیاز به احراز هویت دارند بررسی کنید و گزارش‌های شما را در قالبی کاربرپسند، مستقیماً از مرورگر بخوانید.
• از خط فرمان . اجرای Lighthouse خود را با اسکریپت های پوسته خودکار کنید.
• به عنوان یک ماژول Node . Lighthouse را در سیستم های یکپارچه سازی مداوم خود ادغام کنید.
• از یک رابط کاربری وب Lighthouse را اجرا کنید و به گزارش ها پیوند دهید، بدون نیاز به نصب.

Lighthouse را در Chrome DevTools اجرا کنید

Lighthouse پنل مخصوص به خود را در Chrome DevTools دارد. برای اجرای گزارش:

1. Google Chrome را برای دسکتاپ دانلود کنید.
2. Chrome را باز کنید و به URL مورد نظر برای بازرسی بروید. شما می توانید هر URL را در وب بررسی کنید.
3. Chrome DevTools را باز کنید .

4. روی تب Lighthouse کلیک کنید.

   

5. روی تجزیه و تحلیل بارگذاری صفحه کلیک کنید. DevTools لیستی از دسته های حسابرسی را به شما نشان می دهد. همه آنها را فعال بگذارید.

6. روی Run audit کلیک کنید. پس از 30 تا 60 ثانیه، Lighthouse گزارشی را در صفحه به شما می دهد.

   

ابزار خط فرمان Node را نصب و اجرا کنید

برای نصب ماژول Node:

1. Google Chrome را برای دسکتاپ دانلود کنید.
2. نسخه پشتیبانی طولانی مدت فعلی Node را نصب کنید.
3. فانوس را نصب کنید پرچم -g آن را به عنوان یک ماژول جهانی نصب می کند.

npm install -g lighthouse

برای اجرای ممیزی:

lighthouse <url>

برای دیدن همه گزینه ها:

lighthouse --help

ماژول Node را به صورت برنامه نویسی اجرا کنید

برای مثالی از اجرای برنامه لایت‌هاوس به‌عنوان یک ماژول Node، استفاده از برنامه‌نویسی را ببینید.

PageSpeed ​​Insights را اجرا کنید

برای اجرای Lighthouse در PageSpeed ​​Insights:

1. به PageSpeed ​​Insights بروید.
2. URL صفحه وب را وارد کنید.

3. روی آنالیز کلیک کنید.

   

Lighthouse را به عنوان افزونه کروم اجرا کنید

برای نصب افزونه:

1. Google Chrome را برای دسکتاپ دانلود کنید.
2. افزونه Lighthouse Chrome را از فروشگاه وب کروم نصب کنید.

برای اجرای ممیزی:

1. در کروم، به صفحه ای که می خواهید بازرسی کنید بروید.

2. کلیک کنید Lighthouse ، در کنار نوار آدرس Chrome یا در منوی افزونه Chrome. پس از کلیک کردن، منوی Lighthouse گسترش می یابد.

   

3. روی ایجاد گزارش کلیک کنید. Lighthouse ممیزی های خود را بر روی صفحه ای که در حال حاضر متمرکز شده است اجرا می کند، سپس یک برگه جدید را با گزارشی از نتایج باز می کند.

   

به اشتراک گذاری و مشاهده گزارش ها به صورت آنلاین

برای مشاهده و اشتراک‌گذاری گزارش‌ها به صورت آنلاین از نمایشگر فانوس دریایی استفاده کنید.

گزارش ها را به صورت JSON به اشتراک بگذارید

Lighthouse Viewer به خروجی JSON گزارش Lighthouse نیاز دارد. خروجی های JSON را به صورت زیر تولید کنید:

• از گزارش فانوس دریایی برای منو روی more_vert کلیک کنید، سپس کلیک کنید ذخیره به عنوان JSON
• خط فرمان . اجرا: shell lighthouse --output json --output-path <path/for/output.json>

برای مشاهده داده های گزارش:

1. نمایشگر فانوس دریایی را باز کنید.
2. فایل JSON را روی Viewer بکشید یا در هر نقطه از Viewer کلیک کنید تا ناوبر فایل خود را باز کنید و فایل را انتخاب کنید.

گزارش ها را به عنوان GitHub Gists به اشتراک بگذارید

اگر نمی‌خواهید به‌طور دستی فایل‌های JSON را منتقل کنید، می‌توانید گزارش‌های خود را به‌عنوان سرفصل GitHub به اشتراک بگذارید. یکی از مزایای gists کنترل نسخه رایگان است.

برای صادر کردن یک گزارش به عنوان یک اصل از گزارش:

1. روی منوی more_vert کلیک کنید، سپس کلیک کنیدIn Viewer را باز کنید . این گزارش در https://googlechrome.github.io/lighthouse/viewer/ قرار دارد.
2. از Viewer، روی منوی more_vert کلیک کنید، سپس کلیک کنیدذخیره به عنوان Gist . اولین باری که این کار را انجام می‌دهید، یک پنجره بازشو اجازه دسترسی به داده‌های اصلی GitHub شما، و خواندن و نوشتن در اصل شما را می‌خواهد.

برای صادر کردن یک گزارش به عنوان یک خلاصه از نسخه CLI Lighthouse، به صورت دستی یک خلاصه ایجاد کنید و خروجی JSON گزارش را در اصل کپی کنید. نام فایل gist حاوی خروجی JSON باید به .lighthouse.report.json ختم شود. برای مثالی از نحوه تولید خروجی JSON از ابزار خط فرمان، به اشتراک گزارش ها به عنوان JSON مراجعه کنید.

برای مشاهده گزارشی که به صورت خلاصه ذخیره شده است:

• ?gist=<ID> به URL Viewer اضافه کنید، جایی که <ID> شناسه اصلی است. text https://googlechrome.github.io/lighthouse/viewer/?gist=<ID>
• Viewer را باز کنید و URL یک اصل را در آن قرار دهید.

توسعه پذیری فانوس دریایی

هدف Lighthouse ارائه راهنمایی های مرتبط و قابل اجرا برای همه توسعه دهندگان وب است. برای این منظور، دو ویژگی در دسترس است که به شما امکان می دهد Lighthouse را با نیازهای خاص خود تنظیم کنید.

بسته های پشته

توسعه دهندگان از بسیاری از فن آوری های مختلف (بک اند، سیستم های مدیریت محتوا و چارچوب های جاوا اسکریپت) برای ساخت صفحات وب خود استفاده می کنند. به جای ارائه توصیه های کلی، لایت هاوس بسته به ابزارهای مورد استفاده، توصیه های مرتبط و عملی را ارائه می دهد.

بسته‌های پشته به Lighthouse اجازه می‌دهد تا تشخیص دهد که سایت شما بر روی چه پلتفرمی ساخته شده است و توصیه‌های مبتنی بر پشته را نمایش می‌دهد. این توصیه ها توسط کارشناسان جامعه تعریف و مدیریت می شوند.

برای مشارکت در یک بسته پشته، دستورالعمل‌های مشارکت را مرور کنید.

پلاگین های فانوس دریایی

افزونه های Lighthouse به متخصصان دامنه اجازه می دهد تا عملکرد Lighthouse را برای نیازهای خاص جامعه خود گسترش دهند. می توانید از داده هایی که Lighthouse جمع آوری می کند برای ایجاد ممیزی های جدید استفاده کنید. در هسته خود، افزونه Lighthouse یک ماژول گره است که مجموعه ای از بررسی ها را پیاده سازی می کند تا توسط Lighthouse اجرا شود و به عنوان یک دسته جدید به گزارش اضافه شود.

برای کسب اطلاعات بیشتر در مورد نحوه ایجاد افزونه خود، به کتابچه راهنمای افزونه ما در مخزن Lighthouse GitHub مراجعه کنید.

فانوس دریایی را ادغام کنید

اگر یک شرکت یا فردی هستید که Lighthouse را به عنوان بخشی از محصولات یا خدماتی که ارائه می‌دهید ادغام می‌کنید، عالی است! ما می خواهیم تا آنجا که ممکن است مردم از Lighthouse استفاده کنند.

به دستورالعمل ها و دارایی های برند برای یکپارچه سازی فانوس دریایی مراجعه کنید تا نشان دهید که لایت هاوس استفاده می شود و در عین حال از نام تجاری ما محافظت می کند.

به فانوس دریایی کمک کنید

Lighthouse منبع باز است و مشارکت پذیرفته می شود ! ردیاب Issue مخزن را بررسی کنید تا اشکالاتی را که می‌توانید برطرف کنید ، یا ممیزی‌هایی را که می‌توانید ایجاد یا بهبود ببخشید، بیابید. Issues مکان خوبی برای بحث در مورد معیارهای عملکرد، ایده‌هایی برای ممیزی جدید، یا هر چیز دیگری مربوط به Lighthouse است.