جدید در کروم 63

و خیلی چیزهای دیگر وجود دارد!

من پیت لی پیج هستم. بیایید وارد شوید و ببینیم چه چیزی برای توسعه دهندگان در Chrome 63 جدید است!

لیست کامل تغییرات را می خواهید؟ فهرست تغییرات مخزن منبع Chromium را بررسی کنید.

واردات ماژول پویا

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

خوشبختانه، این تغییر در Chrome 63، با نحو جدید واردات پویا . این به شما اجازه می دهد تا به صورت پویا کد را در ماژول ها و اسکریپت ها در زمان اجرا بارگذاری کنید . می توان از آن برای بارگذاری تنبل یک اسکریپت فقط در صورت نیاز استفاده کرد و عملکرد برنامه شما را بهبود بخشید.

button.addEventListener('click', event => {
  import('./dialogBox.js')
  .then(dialogBox => {
    dialogBox.open();
  })
  .catch(error => {
    /* Error handling */
  });
});

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

تکرار کننده ها و مولدهای همگام

نوشتن کدی که هر نوع تکراری را با توابع async انجام می دهد می تواند زشت باشد. در واقع، این بخش اصلی سوال کدنویسی مصاحبه مورد علاقه من است.

اکنون، با توابع تولید کننده async و پروتکل تکرار همگام ، مصرف یا اجرای منابع داده جریانی ساده می شود و سوال کدنویسی من بسیار آسان تر می شود.

async function* getChunkSizes(url) {
  const response = await fetch(url);
  const b = response.body;
  for await (const chunk of magic(b)) {
    yield chunk.length;
  }
}

تکرارکننده‌های Async را می‌توان در حلقه‌های for-of و همچنین برای ایجاد تکرارکننده‌های همگام سفارشی خود از طریق کارخانه‌های تکرارکننده async استفاده کرد.

رفتار بیش از اسکرول

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

قبل، با رفرش کامل صفحه.

پس از آن، فقط محتوا را بازخوانی کنید.

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

Chrome 63 اکنون از ویژگی CSS overscroll-behavior پشتیبانی می‌کند، و به راحتی می‌توان رفتار پیمایش سرریز پیش‌فرض مرورگر را نادیده گرفت.

می توانید از آن برای موارد زیر استفاده کنید:

بهترین بخش، overscroll-behavior تاثیر منفی بر عملکرد صفحه شما ندارد!

رابط کاربری مجوز تغییر می کند

من عاشق اعلان‌های فشار وب هستم، اما از تعداد سایت‌هایی که برای بارگذاری صفحه بدون هیچ زمینه‌ای اجازه می‌خواهند، واقعاً ناامید شده‌ام - و من تنها نیستم.

90٪ از تمام درخواست های مجوز نادیده گرفته می شوند یا به طور موقت مسدود می شوند.

در Chrome 59، اگر کاربر سه بار درخواست را رد کرد، با مسدود کردن موقت مجوز، شروع به رفع این مشکل کردیم. اکنون در m63، Chrome for Android، درخواست‌های مجوز گفتگوهای معین را ایجاد می‌کند.

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

و بیشتر!

اینها تنها تعدادی از تغییرات کروم 63 برای توسعه دهندگان است، البته موارد بسیار بیشتری نیز وجود دارد.

  • finally اکنون در نمونه های Promise موجود است و پس از تحقق یا رد یک Promise فراخوانی می شود.
  • Device Memory JavaScript API جدید با ارائه نکاتی درباره مقدار کل RAM دستگاه کاربر به شما کمک می کند محدودیت های عملکرد را درک کنید. می‌توانید تجربه خود را در زمان اجرا تنظیم کنید، پیچیدگی را در دستگاه‌های پایین‌تر کاهش دهید، و تجربه بهتری را با ناامیدی کمتر به کاربران ارائه دهید.
  • Intl.PluralRules API به شما امکان می‌دهد برنامه‌هایی بسازید که با مشخص کردن اینکه کدام شکل جمع برای یک عدد و یک زبان خاص اعمال می‌شود، برنامه‌هایی بسازید که تکثر یک زبان را درک کنند. و می تواند به اعداد ترتیبی کمک کند.

حتماً در کانال یوتیوب ما مشترک شوید ، و هر زمان که ویدیوی جدیدی را راه اندازی کنیم، یک اعلان ایمیل دریافت خواهید کرد.

من Pete LePage هستم، و به محض اینکه Chrome 64 منتشر شد، اینجا خواهم بود تا به شما بگویم -- چه چیزهای جدیدی در Chrome وجود دارد!