خلاصه‌ای از اخبار و به‌روزرسانی‌های مهمی که درطول رویداد انجمن آنلاین ۳ روزه ما اعلام شد، و یادآوری درباره رویدادهای منطقه‌ای آتی.
رویداد سه‌روزه web.dev LIVE را به‌تازگی به پایان رساندیم. در این رویداد، برخی از اعضای انجمن وب به‌صورت آنلاین گرد هم آمدند تا درباره وضعیت توسعه وب صحبت کنند. هر روز را در منطقه زمانی منطقه‌ای متفاوتی شروع کردیم و کارمندان Google با هدف کمک به توسعه‌دهندگان ازطریق ارائه ابزارها و راهنمایی‌ها برای حفظ پایداری، قدرت، و دسترس‌پذیری وب، مجموعه‌ای از به‌روزرسانی‌ها، اخبار، و نکته‌ها را هم‌رسانی کردند.
اگر بخشی از جاری‌سازی زنده را ازدست دادید، همه جلسه‌ها ضبط شده‌اند و برای تماشا در YouTube دردسترس هستند. همچنین رویدادهای منطقه‌ای در سراسر جهان داریم که توسط Google Developer Groups سازماندهی شده‌اند و جلسات عمیقی درباره موضوعات مرتبط با آنچه در web.dev LIVE پوشش دادیم ارائه خواهند داد.
بیایید به برخی‌از اخبار و به‌روزرسانی‌هایی که در این سه روز هم‌رسانی شد بپردازیم.
معیارهای کلیدی وب
تیم Chrome طرح ابتکاری Web Vitals را اعلام کرد تا راهنمایی، سنجه‌ها، و ابزارهای یکپارچه‌ای را برای کمک به توسعه‌دهندگان در ارائه تجربه‌های کاربری عالی در وب فراهم کند. تیم «جستجوی Google» نیز اخیراً اعلام کرده است که تجربه صفحه را به‌عنوان معیار رتبه‌بندی ارزیابی خواهد کرد و سنجه‌های Core Web Vitals را به‌عنوان پایه آن درنظر خواهد گرفت.
سه ستون «معیارهای کلیدی اصلی وب» ۲۰۲۰ عبارت‌اند از بارگیری، تعاملی بودن، و پایداری دیداری محتوای صفحه که با سنجه‌های زیر ثبت می‌شوند:
- بزرگ‌ترین نقاشی دارای محتوا سرعت بار شدن درک‌شده را می‌سنجد و نقطه‌ای را در خط زمان بار شدن صفحه علامت‌گذاری می‌کند که محتوای اصلی صفحه احتمالاً در آن زمان بار شده است.
- تأخیر ورودی اول میزان پاسخ‌گویی را می‌سنجد و تجربه‌ای را که کاربران هنگام تلاش برای اولین تعامل با صفحه احساس می‌کنند، کمی‌سازی می‌کند.
- تغییر چیدمان تجمعی پایداری دیداری را اندازه‌گیری می‌کند و مقدار حرکت غیرمنتظره محتوای صفحه را کمی‌سازی می‌کند.
در web.dev LIVE، روال‌های مطلوب را درباره نحوه بهینه‌سازی برای Core Web Vitals و نحوه استفاده از Chrome DevTools برای کاوش مقادیر vitals سایتتان هم‌رسانی کردیم. همچنین گفتگوهای بسیار دیگری درباره عملکرد ارائه کردیم که می‌توانید آن‌ها را در web.dev/live در برنامه روز اول پیدا کنید.
tooling.report
توسعه برای پلتفرمی به گستردگی وب می‌تواند چالش‌برانگیز باشد. ابزارهای ساخت اغلب در قلب پروژه توسعه وب شما قرار دارند و نقش کلیدی در مدیریت چرخه عمر توسعه‌دهنده و محصول شما ایفا می‌کنند.
همه ما فایل‌های پیکربندی ساخت نامناسب را دیده‌ایم، بنابراین برای کمک به توسعه‌دهندگان وب و نویسندگان ابزارها برای غلبه بر پیچیدگی وب، tooling.report را ساختیم. این وب‌سایت به شما کمک می‌کند ابزار ساخت مناسب را برای پروژه بعدی‌تان انتخاب کنید، تصمیم بگیرید که آیا مهاجرت از یک ابزار به ابزار دیگر ارزشش را دارد یا نه، یا بفهمید که چگونه بهترین شیوه‌ها را در پیکربندی ابزار و پایگاه کد خود بگنجانید.
مجموعه‌ای از آزمایش‌ها را طراحی کردیم تا مشخص کنیم کدام ابزارهای ساخت به شما امکان می‌دهند روال‌های مطلوب توسعه وب را دنبال کنید. با نویسندگان ابزار ساخت همکاری کردیم تا مطمئن شویم از ابزارهایشان به‌درستی استفاده می‌کنیم و آن‌ها را به‌طور منصفانه نشان می‌دهیم.
نسخه اولیه tooling.report شامل webpack v4، Rollup v2، Parcel v2، و Browserify با Gulp است، که به‌نظر می‌رسد درحال‌حاضر محبوب‌ترین ابزارهای ساخت باشند. ما tooling.report را با انعطاف‌پذیری افزودن ابزارهای ساخت بیشتر و آزمایش‌های اضافی با کمک انجمن ساختیم.
اگر روال مطلوبی را که باید آزمایش شود ازقلم انداخته‌ایم، لطفاً آن را در GitHub پیشنهاد دهید. اگر مایلید آزمایشی بنویسید یا ابزار جدیدی اضافه کنید که در مجموعه اولیه قرار نداده‌ایم، از مشارکت شما استقبال می‌کنیم!
در این فاصله، می‌توانید درباره رویکرد ما نسبت به ساختن tooling.report بیشتر بخوانید و جلسه ما از web.dev LIVE را تماشا کنید.
حریم خصوصی و امنیت در وب
Chrome به وب باز معتقد است که به حریم خصوصی کاربران احترام می‌گذارد و موارد استفاده کلیدی را حفظ می‌کند که وب را برای همه فعال نگه می‌دارد.
در سال ۲۰۱۹، Chrome به‌روزرسانی‌ای برای استاندارد کوکی پیشنهاد کرد تا کوکی‌ها را به‌طور پیش‌فرض به بافت‌های طرف اول محدود کند و کوکی‌های بافت‌های طرف سوم را ملزم کند که به‌طور صریح به‌عنوان کوکی طرف سوم علامت‌گذاری شوند. به‌طور دقیق، این کار یک خط دفاعی دربرابر حملات «جعل درخواست بین‌سایتی» ایجاد می‌کند. این پیشنهاد اکنون توسط Chrome، Firefox، Edge، و مرورگرهای دیگر درحال پذیرفته شدن است.
درحالی‌که Chrome تصمیم گرفت به‌دلیل کووید-۱۹ این تغییرات را موقتاً لغو کند، متأسفانه درطول بحران که افراد آسیب‌پذیرتر هستند، شاهد افزایش این نوع حملات نیز هستید. بنابراین، با انتشار نسخه پایدار Chrome 84 (اواسط ژوئیه ۲۰۲۰)، تغییرات دوباره در همه نسخه‌های Chrome از ۸۰ به بالا عرضه خواهد شد. برای کسب اطلاعات بیشتر، راهنمای کوکی‌های SameSite و همچنین جلسه LIVE در web.dev را بررسی کنید.
علاوه‌براین، تحت عنوان جعبه شنی حریم خصوصی، Chrome درحال معرفی تعدادی پیشنهاد استاندارد است که هدفشان پشتیبانی از موارد استفاده‌ای است که به افراد اجازه می‌دهد بااستفاده از پلاتفرم وب امرار معاش کنند، اما این کار را به‌گونه‌ای انجام می‌دهد که به حریم خصوصی کاربر بیشتر احترام می‌گذارد. Chrome فعالانه به‌دنبال بازخورد درباره این پیشنهادها است و در تالارهای گفتمان باز W3C شرکت می‌کند تا درباره این پیشنهادها و همچنین پیشنهادهای ارائه‌شده توسط طرف‌های دیگر بحث کند. در جلسه امنیت و حریم خصوصی برای وب باز درباره این طرح بیشتر بدانید.
درنهایت، با نگاهی به امنیت کاربر، Spectre آسیب‌پذیری‌ای بود که به این معنی بود که کد مخربی که در یک فرایند مرورگر اجرا می‌شود ممکن است بتواند هر داده مرتبط با آن فرایند را بخواند، حتی اگر از منبع دیگری باشد. یکی از اقدامات کاهشی مرورگر برای این موضوع، جداسازی سایت است، یعنی قرار دادن هر سایت در یک فرایند جداگانه. برای کسب اطلاعات بیشتر، جلسه LIVE در وب‌سایت web.dev را درباره خط‌مشی‌های جدید «جاسازنده و بازکننده میان‌مبدئی» (COOP و COEP) تماشا کنید.
ساختن وب با قابلیت‌های قدرتمند
Chrome می‌خواهد شما آزاد باشید تا باکیفیت‌ترین برنامه‌های وب را ایجاد کنید که بیشترین دسترسی را به کاربران در دستگاه‌های مختلف می‌دهد. با ترکیب نصب‌پذیری و قابلیت اطمینان برنامه‌های وب پیش‌رونده با پروژه قابلیت‌ها (پروژه Fugu)، Chrome روی سه مورد تمرکز می‌کند تا فاصله بین برنامه‌های مختص پلاتفرم و وب را کاهش دهد و به شما کمک کند تجربه‌های عالی بسازید و ارائه دهید.
ابتدا، تیم‌های Chrome سخت تلاش کرده‌اند تا به توسعه‌دهندگان وب و کاربران کنترل بیشتری بر تجربه نصب بدهند، تبلیغ نصب را به omnibox اضافه کنند، و غیره. باوجود فراگیر بودن وب، هنوز هم برای برخی کسب‌وکارها مهم است که برنامه خود را در فروشگاه داشته باشند. برای کمک، Chrome Bubblewrap را راه‌اندازی کرد، کتابخانه و CLI که وارد کردن PWA شما به «فروشگاه Play» را بسیار آسان می‌کند. درواقع، PWABuilder.com اکنون از Bubblewrap در پشت صحنه استفاده می‌کند. فقط با چند کلیک موشواره می‌توانید APK تولید کنید و «برنامه وب پیش‌رونده» خود را در «فروشگاه Play» بارگذاری کنید، به‌شرطی که معیارها را برآورده کنید.
دوم، Chrome ادغام محکم‌تری با سیستم‌عامل ارائه می‌دهد، مانند توانایی هم‌رسانی عکس، آهنگ، یا هر چیز دیگری با فراخوانی سرویس هم‌رسانی در سطح سیستم با Web Share API، یا توانایی دریافت محتوا هنگام هم‌رسانی از یک برنامه نصب‌شده دیگر. می‌توانید کاربران را به‌روز نگه دارید، یا به‌طور ظریف آن‌ها را از فعالیت جدید با نشان برنامه مطلع کنید. همچنین، اکنون کاربران راحت‌تر می‌توانند بااستفاده از میان‌برهای برنامه که در Chrome 84 (اواسط ژوئیه ۲۰۲۰) ارائه می‌شود، کنشی را به‌سرعت شروع کنند.
و درنهایت، Chrome روی قابلیت‌های جدیدی کار کرده است که سناریوهای جدیدی را که قبلاً ممکن نبودند فعال می‌کند، مانند ویرایشگرهایی که فایل‌ها را در سیستم فایل محلی کاربر می‌خوانند و می‌نویسند، یا فهرست قلم‌های نصب‌شده محلی را دریافت می‌کنند تا کاربران بتوانند از آن‌ها در طراحی‌های خود استفاده کنند.
درطول web.dev LIVE، درباره بسیاری از قابلیت‌ها و ویژگی‌های دیگر صحبت کردیم که می‌توانند به شما امکان دهند همان نوع تجربه را با همان قابلیت‌ها، به‌عنوان برنامه‌های خاص پلاتفرم، ارائه دهید. همه جلسه‌ها را در web.dev/live در زمان‌بندی روز دوم ببینید.
ویژگی‌های جدید Chrome DevTools و Lighthouse 6.0
Chrome Devtools: برگه «مشکلات جدید»، شبیه‌ساز کوررنگی، و پشتیبانی از Web Vitals
یکی از قدرتمندترین ویژگی‌های Chrome DevTools توانایی آن در شناسایی مشکلات در صفحه وب و جلب توجه توسعه‌دهنده به آن‌ها است. این موضوع با ورود ما به مرحله بعدی وب متمرکز بر حریم خصوصی بسیار مرتبط است. برای کاهش خستگی ناشی از اعلان‌ها و به‌هم‌ریختگی در «کنسول»، Chrome DevTools برگه «مشکلات» را راه‌اندازی کرد که در ابتدا بر سه نوع مشکل بحرانی تمرکز دارد: مشکلات کوکی، محتوای مختلط، و مشکلات COEP. برای شروع، جلسه web.dev LIVE را درباره یافتن و رفع کردن مشکلات با برگه «مشکلات» تماشا کنید.
علاوه‌براین، با تبدیل شدن معیارهای کلیدی اصلی وب به یکی از مهم‌ترین مجموعه‌های سنجه‌ها برای توسعه‌دهندگان وب جهت ردیابی و اندازه‌گیری، DevTools می‌خواهد مطمئن شود توسعه‌دهندگان می‌توانند به‌راحتی عملکرد خود را دربرابر این آستانه‌ها ردیابی کنند. بنابراین این سه سنجه اکنون در پانل «عملکرد» Chrome DevTools قرار دارند.
و درنهایت، با افزایش تعداد توسعه‌دهندگانی که بر دسترس‌پذیری تمرکز می‌کنند، DevTools همچنین شبیه‌ساز نقص دید رنگی را معرفی کرد که به توسعه‌دهندگان اجازه می‌دهد تاری دید و انواع دیگر نقص‌های بینایی را شبیه‌سازی کنند. می‌توانید درباره این ویژگی و بسیاری از ویژگی‌های دیگر در جلسه تازه‌های DevTools بیشتر بدانید.
Lighthouse 6.0: New metrics, Core Web Vitals lab measurements, an updated Performance score, and new audits
Lighthouse ابزاری خودکارشده و متن‌باز است که به توسعه‌دهندگان کمک می‌کند عملکرد سایتشان را بهبود بخشند. در جدیدترین نسخه، تیم Lighthouse بر ارائه اطلاعات آماری براساس سنجه‌هایی تمرکز کرده است که دیدی متعادل از کیفیت تجربه کاربری‌تان درمقابل ابعاد بحرانی به شما می‌دهد.
برای اطمینان از سازگاری، Lighthouse پشتیبانی از «معیارهای کلیدی اصلی وب» را اضافه کرد: LCP، TBT (پراکسی برای FID، زیرا Lighthouse ابزاری آزمایشگاهی است و FID فقط می‌تواند در میدان اندازه‌گیری شود) و CLS. Lighthouse همچنین سه سنجه قدیمی را حذف کرد: اولین رنگ‌آمیزی معنادار، اولین زمان بیکاری CPU، و حداکثر تأخیر ورودی اول بالقوه. این حذف‌ها به‌دلیل ملاحظاتی مانند تغییرپذیری سنجه‌ها و سنجه‌های جدیدتری است که بازتاب بهتری از بخشی از تجربه کاربری را که Lighthouse سعی در اندازه‌گیری آن دارد ارائه می‌دهند. علاوه‌براین، Lighthouse براساس بازخورد کاربران، تغییراتی در میزان تأثیر هر سنجه بر امتیاز کلی «عملکرد» ایجاد کرده است.
Lighthouse همچنین یک ماشین حساب امتیازدهی اضافه کرده است تا به شما کمک کند امتیاز عملکرد خود را با ارائه مقایسه‌ای بین امتیازات نسخه ۵ و ۶ بررسی کنید. وقتی ممیزی را با Lighthouse 6.0 اجرا می‌کنید، گزارش با پیوندی به ماشین‌حساب همراه با نتایج شما ارائه می‌شود.
و درنهایت، Lighthouse تعدادی ممیزی جدید اضافه کرد که بر تجزیه‌وتحلیل جاوا اسکریپت و دسترس‌پذیری تمرکز دارند.
با تماشای جلسه تازه‌ها در ابزار سرعت، اطلاعات بیشتری کسب کنید.
بیشتر بدانید
از همه اعضای انجمن که برای بحث درباره فرصت‌ها و چالش‌های پلاتفرم وب به ما پیوستند سپاس‌گزاریم.
این پست برخی‌از نکات برجسته رویداد را خلاصه می‌کند، اما موارد بسیار بیشتری وجود داشت. حتماً همه جلسه‌ها را بررسی کنید و اگر می‌خواهید محتوای بیشتری مستقیماً به صندوق ورودی‌تان ارسال شود، در خبرنامه web.dev مشترک شوید. و برای پیدا کردن رویداد انجمن آتی در منطقه زمانی‌تان، به بخش رویدادهای منطقه‌ای در web.dev/live مراجعه کنید!