جدید در کروم 89

کروم ۸۹ اکنون در حال انتشار نسخه پایدار است.

آنچه باید بدانید این است:

من پیت لپیج هستم، از خانه کار می‌کنم و عکاسی می‌کنم، بیایید شروع کنیم و ببینیم چه چیزهایی برای توسعه‌دهندگان در کروم ۸۹ جدید است!

WebHID، WebNFC و سریال وب

من واقعاً در مورد WebHID، WebNFC و Web Serial هیجان‌زده هستم. آن‌ها سناریوهای جدیدی را برای کاربران ایجاد می‌کنند که قبلاً هرگز امکان‌پذیر نبوده‌اند، یعنی تعامل با سخت‌افزار دنیای واقعی.

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

با استفاده از Web Serial و حدود ۶۰ خط کد، @AndreBan صفحه‌ای ایجاد کرد که می‌تواند با MicroPython REPL روی Raspberry Pi Pico تعامل داشته باشد. Web Serial همچنین توسط Espruino در IDE مبتنی بر وب آنها استفاده می‌شود.

در CDS 2019، فرانسوا یک بازی سرگرم‌کننده به سبک حافظه با استفاده از وب NFC نوشت. شما باید گوشی را به ترتیب درست روی کارت درست لمس می‌کردید.

استریم‌دک با پد درام دفت پانک

و مورد علاقه من، @bramus از WebHID برای اتصال به StreamDeck استفاده کرد و یک پد درام Daft Punk ساخت. اگر StreamDeck ندارید، ویدیوی آزمایشی او را در YouTube و کد آن را در GitHub بررسی کنید.

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

می‌توانید در web.dev/devices درباره برخی از دستگاه‌هایی که می‌توانید به آنها متصل شوید اطلاعات بیشتری کسب کنید، یا راهنماهای شروع به کار برای WebHID ، WebNFC و Web Serial را بررسی کنید.

معیارهای نصب PWA تغییر می‌کند

پشتیبانی آفلاین از ابتدا بخش کلیدی معیارهای برنامه‌های وب پیش‌رونده برای قابلیت نصب بوده است. مانند سایر برنامه‌های نصب‌شده، کاربران انتظار دارند که این برنامه به طور قابل اعتمادی کار کند. باید سریع باشد و هرگز نباید دایناسور آفلاین را ببینند!

اواخر امسال، قصد داریم خلائی را که به چند سایت اجازه می‌داد بدون تجربه آفلاین، معیارهای قابلیت نصب را پشت سر بگذارند، برطرف کنیم. اگر PWA شما از قبل تجربه آفلاین دارد، همه چیز آماده است. هیچ اقدامی لازم نیست، اما اگر ندارید، وقت آن است که یکی اضافه کنید!

از کروم ۸۹ به بعد، اگر PWA شما در حالت آفلاین پاسخ معتبری ارائه ندهد، در DevTools در زیر تب Issues هشداری مشاهده خواهید کرد و Lighthouse وجود مشکل را اعلام خواهد کرد. و اعمال این قانون در کروم ۹۳، اواخر امسال آغاز خواهد شد.

DevTools پیام هشدار را در کنسول نشان می‌دهد.
پیام هشدار در کنسول DevTools کروم.
DevTools پیام هشدار را در برگه برنامه نشان می‌دهد.
پیام هشدار در تب Application > Manifest > Installability.

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

می‌توانید جزئیات بیشتر در مورد این تغییر و دلیل اعمال آن را در بخش «بهبود تشخیص پشتیبانی آفلاین برنامه‌های وب پیش‌رونده» بیابید.

اگر مطمئن نیستید از کجا شروع کنید، Workbox را بررسی کنید. این ابزار مجموعه‌ای از کتابخانه‌ها را دارد که می‌توانند یک service worker آماده برای PWA شما را راه‌اندازی کنند. یا برای یک صفحه پشتیبان آفلاین ساده، مقاله «ایجاد یک صفحه پشتیبان آفلاین» تمام کد مورد نیاز شما را دارد و می‌توانید آن را مستقیماً در سایت خود کپی و جایگذاری کنید.

اشتراک‌گذاری وب و هدف اشتراک‌گذاری وب برای دسکتاپ

اگر سایت شما به کاربران اجازه می‌دهد فایل‌ها را ایجاد، ویرایش یا با آنها تعامل داشته باشند، باید از APIهای Web Share و Web Share Target استفاده کنید. این APIها مدتی است که در موبایل در دسترس هستند اما اکنون در ChromeOS و Windows نیز پشتیبانی می‌شوند.

اشتراک‌گذاری وب به کاربران این امکان را می‌دهد که فایل‌ها یا داده‌ها را به سایر برنامه‌های نصب‌شده روی دستگاه خود ارسال کنند، برای مثال، اشتراک‌گذاری عکس از Google Photos در توییتر.

async function share(title, text, url) {
  try {
    await navigator.share({title, text, url});
    return true;
  } catch (ex) {
    console.error('Share failed', ex);
    return false;
  }
}

برای اینکه به عنوان یک هدف ثبت نام کنید تا سایر برنامه‌ها بتوانند فایل‌ها یا داده‌ها را با شما به اشتراک بگذارند، باید از API اشتراک‌گذاری هدف وب (Web Share Target API) استفاده کنید.

"share_target": {
  "action": "/?share-target",
  "method": "POST",
  "enctype": "multipart/form-data",
  "params": {
    "files": [
      {
        "name": "file",
        "accept": ["image/*"],
      },
    ],
  },
},

برای راهنمایی‌های شروع، گزینه‌های «ادغام با رابط کاربری اشتراک‌گذاری سیستم‌عامل با API اشتراک‌گذاری وب» و «دریافت داده‌های مشترک با API هدف اشتراک‌گذاری وب» را بررسی کنید.

و موارد دیگر

و البته چیزهای بیشتری هم وجود دارد.

کروم اکنون اجازه می‌دهد تا await سطح بالا در ماژول‌های جاوا اسکریپت استفاده شود.

آیکون نصب جدید omnibox برای PWAها

برای کاهش سردرگمی کاربران، آیکون نمایش داده شده در omnibox برای PWA های قابل نصب را به‌روزرسانی کرده‌ایم.


و اگر از یک فعالیت وب مورد اعتماد برای در دسترس قرار دادن PWA خود در فروشگاه Play برای ChromeOS استفاده کرده‌اید، می‌توانید برای نسخه آزمایشی API کالاهای دیجیتال ثبت نام کنید.

مطالعه بیشتر

این تنها برخی از نکات برجسته کلیدی را پوشش می‌دهد. درباره تغییرات در کروم ۸۹ بیشتر بدانید.

اشتراک

اگر می‌خواهید از ویدیوهای ما به‌روز بمانید، در کانال یوتیوب توسعه‌دهندگان کروم ما مشترک شوید تا هر زمان که ویدیوی جدیدی منتشر کنیم، از طریق ایمیل به شما اطلاع داده شود.