در Chrome 73، ما پشتیبانی از موارد زیر را اضافه کردهایم:
- ایجاد محتوای قابل حمل آسان تر با صرافی های HTTP امضا شده .
- تغییر پویا سبک ها با شیوه نامه های قابل ساخت آسان تر می شود.
- پشتیبانی از برنامههای وب پیشرو در Mac ارائه میشود، و پشتیبانی از PWA را برای همه پلتفرمهای دسکتاپ و موبایل فراهم میکند و ایجاد برنامههای قابل نصب را که از طریق وب ارائه میشوند آسان میکند.
و خیلی چیزهای دیگر وجود دارد!
من پیت لی پیج هستم. بیایید وارد آن شویم و ببینیم چه چیز جدیدی برای توسعه دهندگان در Chrome 73 وجود دارد!
تغییر گزارش
این فقط برخی از نکات کلیدی را پوشش می دهد، پیوندهای زیر را برای تغییرات بیشتر در Chrome 73 بررسی کنید.
- فهرست تغییر مخزن منبع Chromium
- بهروزرسانیهای ChromeStatus.com برای Chrome 73
- لغو و حذف Chrome 73
- بهروزرسانیهای رسانه Chrome 73
- موارد جدید در جاوا اسکریپت در Chrome 73
برنامه های وب پیشرو در همه جا کار می کنند
برنامه های وب پیشرو تجربه ای قابل نصب و برنامه مانند را ارائه می دهند که مستقیماً از طریق وب ساخته و ارائه می شود. در Chrome 73، ما پشتیبانی از macOS را اضافه کردهایم، که پشتیبانی از برنامههای وب پیشرفته را برای همه پلتفرمهای دسکتاپ - Mac، Windows، ChromeOS و Linux، و همچنین موبایل، ارائه میکند و توسعه برنامههای وب را ساده میکند.
یک برنامه وب پیشرفته سریع و قابل اعتماد است. همیشه بدون در نظر گرفتن اتصال به شبکه، با سرعت یکسان بارگیری و اجرا می شود. آنها تجربیات غنی و جذابی را از طریق ویژگی های وب مدرن ارائه می دهند که از قابلیت های دستگاه بهره کامل می برد.
کاربران میتوانند PWA شما را از منوی زمینه Chrome نصب کنند، یا میتوانید مستقیماً تجربه نصب را با استفاده از رویداد beforeinstallprompt
ارتقا دهید. پس از نصب، یک PWA با سیستم عامل ادغام می شود تا مانند یک برنامه بومی رفتار کند: کاربران آنها را از همان مکان برنامه های دیگر پیدا کرده و راه اندازی می کنند، آنها در پنجره خودشان اجرا می شوند، در Task switcher ظاهر می شوند، نمادهای آنها می توانند نشان اعلان را نشان دهند. و غیره
ما می خواهیم شکاف قابلیت بین وب و بومی را ببندیم تا پایه ای محکم برای برنامه های کاربردی مدرن ارائه شده در وب فراهم کنیم. ما در حال کار برای افزودن قابلیتهای جدید پلتفرم وب هستیم که به شما امکان دسترسی به مواردی مانند سیستم فایل ، wake lock ، افزودن یک نشان محیطی به نوار آدرس را میدهد تا کاربران بدانند PWA شما میتواند نصب شود، نصب خطمشی برای شرکتها، و موارد دیگر. .
اگر در حال ساخت یک PWA موبایل هستید، PWA دسکتاپ تفاوتی ندارد. در واقع، اگر از طراحی ریسپانسیو استفاده کرده اید، احتمالاً از قبل شروع به کار کرده اید. پایگاه کد واحد شما در دسکتاپ و موبایل کار خواهد کرد. اگر به تازگی شروع به کار با PWA کرده اید، از اینکه ساختن آنها چقدر آسان است شگفت زده خواهید شد!
سپس، از آنجا تکرار کنید.
صرافی های HTTP امضا شده
Signed HTTP Exchanges (SXG)، بخشی از یک فناوری نوظهور به نام بستههای وب ، اکنون در Chrome 73 در دسترس است. یک تبادل HTTP امضا شده، ایجاد محتوای «قابل حمل» را که میتواند توسط طرفهای دیگر ارائه شود، ممکن میسازد، و این جنبه کلیدی است، یکپارچگی و انتساب سایت اصلی را حفظ می کند.
این کار منشأ محتوا را از سروری که آن را ارائه میکند جدا میکند، اما چون امضا شده است، مانند این است که از سرور شما تحویل داده میشود. وقتی مرورگر این Signed Exchange را بارگیری میکند، میتواند با خیال راحت URL شما را در نوار آدرس نشان دهد زیرا امضای موجود در صرافی نشان میدهد که محتوا در اصل از مبدا شما آمده است.
صرافیهای HTTP امضا شده، تحویل سریعتر محتوا را برای کاربران امکانپذیر میسازد، و این امکان را فراهم میکند که از مزایای CDN بدون نیاز به واگذاری کنترل کلید خصوصی گواهیتان استفاده کنید. تیم AMP در حال برنامه ریزی برای استفاده از تبادل HTTP امضا شده در صفحات نتایج جستجوی Google برای بهبود URL های AMP و افزایش سرعت کلیک بر روی نتایج جستجو است.
برای جزئیات در مورد نحوه شروع، پست تبادل HTTP امضا شده Kinuko را بررسی کنید.
استایل شیت های قابل ساخت
صفحات سبک ساختنی، جدید در Chrome 73، روش جدیدی را برای ایجاد و توزیع سبکهای قابل استفاده مجدد در اختیار ما قرار میدهد، که به ویژه هنگام استفاده از Shadow DOM مهم است.
ایجاد شیوه نامه با استفاده از جاوا اسکریپت همیشه امکان پذیر بوده است. با استفاده از document.createElement('style')
یک عنصر <style>
ایجاد کنید. سپس به ویژگی sheet آن دسترسی پیدا کنید تا به نمونه CSSStyleSheet
زیرین مراجعه کنید و استایل را تنظیم کنید.
استفاده از این روش منجر به نفخ استایل شیت می شود. حتی بدتر، باعث فلش محتوای بدون استایل می شود. Stylesheets ساختنی این امکان را فراهم می کند که سبک های CSS مشترک را تعریف و آماده کنید و سپس آن استایل ها را بر روی چندین Shadow Roots یا Document به راحتی و بدون تکرار اعمال کنید.
بهروزرسانیهای یک CSSStyleSheet
به اشتراکگذاشتهشده برای همه ریشههایی اعمال میشود که در آنجا مورد پذیرش قرار گرفتهاند، و پس از بارگیری صفحه، استفاده از شیوه نامه سریع و همزمان است.
شروع کار ساده است، یک نمونه جدید از CSSStyleSheet
ایجاد کنید، سپس replace
یا replaceSync
برای به روز رسانی قوانین صفحه سبک استفاده کنید.
const sheet = new CSSStyleSheet();
// replace all styles synchronously:
sheet.replaceSync('a { color: red; }');
// this throws an exception:
try {
sheet.replaceSync('@import url("styles.css")');
} catch (err) {
console.error(err); // imports are not allowed
}
// replace all styles, allowing external resources:
sheet.replace('@import url("styles.css")')
.then(sheet => {
console.log('Styles loaded successfully');
})
.catch(err => {
console.error('Failed to load:', err);
});
برای جزئیات بیشتر و نمونه کد ، پست سبک های قابل استفاده مجدد جیسون میلر را بررسی کنید.
و بیشتر!
اینها تنها تعدادی از تغییرات کروم 73 برای توسعه دهندگان است، البته موارد بسیار بیشتری نیز وجود دارد.
-
matchAll()
یک روش تطبیق عبارات منظم جدید در نمونه اولیه رشته است و یک آرایه حاوی تطابق کامل را برمی گرداند. - عنصر
<link>
اکنونimagesrcset
پشتیبانی میکند و ویژگیهایimagesizes
را مطابق با ویژگیهایsrcset
وsizes
HTMLImageElement
میکند. - اجرای شعاع تاری سایه Blink اکنون با فایرفاکس و سافاری مطابقت دارد.
- حالت تاریک برای رابط کاربری کروم اکنون در مک پشتیبانی می شود و پشتیبانی از ویندوز در راه است. علاوه بر این، روی یک پرسش رسانه CSS کار میشود:
prefers-color-scheme
، که میتواند برای تشخیص اینکه آیا کاربر از سیستم درخواست کرده است که از یک تم رنگ روشن یا تیره استفاده کند، استفاده میشود. اشکال ردیابی برای این ویژگی افزودن پشتیبانی برای CSSprefers-color-scheme
media ویژگی برای کروم و فایرفاکس است.
مشترک شوید
میخواهید با ویدیوهای ما بهروز بمانید، سپس در کانال YouTube Developers Chrome مشترک شوید و هر زمان که ویدیوی جدیدی را راهاندازی کنیم، یک اعلان ایمیلی دریافت خواهید کرد.
من Pete LePage هستم، و به محض اینکه Chrome 74 منتشر شد، اینجا خواهم بود تا به شما بگویم -- چه چیزهای جدیدی در Chrome وجود دارد!
،در Chrome 73، ما پشتیبانی از موارد زیر را اضافه کردهایم:
- ایجاد محتوای قابل حمل آسان تر با صرافی های HTTP امضا شده .
- تغییر پویا سبک ها با شیوه نامه های قابل ساخت آسان تر می شود.
- پشتیبانی از برنامههای وب پیشرو در Mac ارائه میشود، و پشتیبانی از PWA را برای همه پلتفرمهای دسکتاپ و موبایل فراهم میکند و ایجاد برنامههای قابل نصب را که از طریق وب ارائه میشوند آسان میکند.
و خیلی چیزهای دیگر وجود دارد!
من پیت لی پیج هستم. بیایید وارد آن شویم و ببینیم چه چیز جدیدی برای توسعه دهندگان در Chrome 73 وجود دارد!
تغییر گزارش
این فقط برخی از نکات کلیدی را پوشش می دهد، پیوندهای زیر را برای تغییرات بیشتر در Chrome 73 بررسی کنید.
- فهرست تغییر مخزن منبع Chromium
- بهروزرسانیهای ChromeStatus.com برای Chrome 73
- لغو و حذف Chrome 73
- بهروزرسانیهای رسانه Chrome 73
- موارد جدید در جاوا اسکریپت در Chrome 73
برنامه های وب پیشرو در همه جا کار می کنند
برنامه های وب پیشرو تجربه ای قابل نصب و برنامه مانند را ارائه می دهند که مستقیماً از طریق وب ساخته و ارائه می شود. در Chrome 73، ما پشتیبانی از macOS را اضافه کردهایم، که پشتیبانی از برنامههای وب پیشرفته را برای همه پلتفرمهای دسکتاپ - Mac، Windows، ChromeOS و Linux، و همچنین موبایل، ارائه میکند و توسعه برنامههای وب را ساده میکند.
یک برنامه وب پیشرفته سریع و قابل اعتماد است. همیشه بدون در نظر گرفتن اتصال به شبکه، با سرعت یکسان بارگیری و اجرا می شود. آنها تجربیات غنی و جذابی را از طریق ویژگی های وب مدرن ارائه می دهند که از قابلیت های دستگاه بهره کامل می برد.
کاربران میتوانند PWA شما را از منوی زمینه Chrome نصب کنند، یا میتوانید مستقیماً تجربه نصب را با استفاده از رویداد beforeinstallprompt
ارتقا دهید. پس از نصب، یک PWA با سیستم عامل ادغام می شود تا مانند یک برنامه بومی رفتار کند: کاربران آنها را از همان مکان برنامه های دیگر پیدا کرده و راه اندازی می کنند، آنها در پنجره خودشان اجرا می شوند، در Task switcher ظاهر می شوند، نمادهای آنها می توانند نشان اعلان را نشان دهند. و غیره
ما می خواهیم شکاف قابلیت بین وب و بومی را ببندیم تا پایه ای محکم برای برنامه های کاربردی مدرن ارائه شده در وب فراهم کنیم. ما در حال کار برای افزودن قابلیتهای جدید پلتفرم وب هستیم که به شما امکان دسترسی به مواردی مانند سیستم فایل ، wake lock ، افزودن یک نشان محیطی به نوار آدرس را میدهد تا کاربران بدانند PWA شما میتواند نصب شود، نصب خطمشی برای شرکتها، و موارد دیگر. .
اگر در حال ساخت یک PWA موبایل هستید، PWA دسکتاپ تفاوتی ندارد. در واقع، اگر از طراحی ریسپانسیو استفاده کرده اید، احتمالاً از قبل شروع به کار کرده اید. پایگاه کد واحد شما در دسکتاپ و موبایل کار خواهد کرد. اگر به تازگی شروع به کار با PWA کرده اید، از اینکه ساختن آنها چقدر آسان است شگفت زده خواهید شد!
سپس، از آنجا تکرار کنید.
صرافی های HTTP امضا شده
Signed HTTP Exchanges (SXG)، بخشی از یک فناوری نوظهور به نام بستههای وب ، اکنون در Chrome 73 در دسترس است. یک تبادل HTTP امضا شده، ایجاد محتوای «قابل حمل» را که میتواند توسط طرفهای دیگر ارائه شود، ممکن میسازد، و این جنبه کلیدی است، یکپارچگی و انتساب سایت اصلی را حفظ می کند.
این کار منشأ محتوا را از سروری که آن را ارائه میکند جدا میکند، اما چون امضا شده است، مانند این است که از سرور شما تحویل داده میشود. وقتی مرورگر این Signed Exchange را بارگیری میکند، میتواند با خیال راحت URL شما را در نوار آدرس نشان دهد زیرا امضای موجود در صرافی نشان میدهد که محتوا در اصل از مبدا شما آمده است.
صرافیهای HTTP امضا شده، تحویل سریعتر محتوا را برای کاربران امکانپذیر میسازد، و این امکان را فراهم میکند که از مزایای CDN بدون نیاز به واگذاری کنترل کلید خصوصی گواهیتان استفاده کنید. تیم AMP در حال برنامه ریزی برای استفاده از تبادل HTTP امضا شده در صفحات نتایج جستجوی Google برای بهبود URL های AMP و افزایش سرعت کلیک بر روی نتایج جستجو است.
برای جزئیات در مورد نحوه شروع، پست تبادل HTTP امضا شده Kinuko را بررسی کنید.
استایل شیت های قابل ساخت
صفحات سبک ساختنی، جدید در Chrome 73، روش جدیدی را برای ایجاد و توزیع سبکهای قابل استفاده مجدد در اختیار ما قرار میدهد، که به ویژه هنگام استفاده از Shadow DOM مهم است.
ایجاد شیوه نامه با استفاده از جاوا اسکریپت همیشه امکان پذیر بوده است. با استفاده از document.createElement('style')
یک عنصر <style>
ایجاد کنید. سپس به ویژگی sheet آن دسترسی پیدا کنید تا به نمونه CSSStyleSheet
زیرین مراجعه کنید و استایل را تنظیم کنید.
استفاده از این روش منجر به نفخ استایل شیت می شود. حتی بدتر، باعث فلش محتوای بدون استایل می شود. Stylesheets ساختنی این امکان را فراهم می کند که سبک های CSS مشترک را تعریف و آماده کنید و سپس آن استایل ها را بر روی چندین Shadow Roots یا Document به راحتی و بدون تکرار اعمال کنید.
بهروزرسانیهای یک CSSStyleSheet
به اشتراکگذاشتهشده برای همه ریشههایی اعمال میشود که در آنجا مورد پذیرش قرار گرفتهاند، و پس از بارگیری صفحه، استفاده از شیوه نامه سریع و همزمان است.
شروع کار ساده است، یک نمونه جدید از CSSStyleSheet
ایجاد کنید، سپس replace
یا replaceSync
برای به روز رسانی قوانین صفحه سبک استفاده کنید.
const sheet = new CSSStyleSheet();
// replace all styles synchronously:
sheet.replaceSync('a { color: red; }');
// this throws an exception:
try {
sheet.replaceSync('@import url("styles.css")');
} catch (err) {
console.error(err); // imports are not allowed
}
// replace all styles, allowing external resources:
sheet.replace('@import url("styles.css")')
.then(sheet => {
console.log('Styles loaded successfully');
})
.catch(err => {
console.error('Failed to load:', err);
});
برای جزئیات بیشتر و نمونه کد ، پست سبک های قابل استفاده مجدد جیسون میلر را بررسی کنید.
و بیشتر!
اینها تنها تعدادی از تغییرات کروم 73 برای توسعه دهندگان است، البته موارد بسیار بیشتری نیز وجود دارد.
-
matchAll()
یک روش تطبیق عبارات منظم جدید در نمونه اولیه رشته است و یک آرایه حاوی تطابق کامل را برمی گرداند. - عنصر
<link>
اکنونimagesrcset
پشتیبانی میکند و ویژگیهایimagesizes
را مطابق با ویژگیهایsrcset
وsizes
HTMLImageElement
میکند. - اجرای شعاع تاری سایه Blink اکنون با فایرفاکس و سافاری مطابقت دارد.
- حالت تاریک برای رابط کاربری کروم اکنون در مک پشتیبانی می شود و پشتیبانی از ویندوز در راه است. علاوه بر این، روی یک پرسش رسانه CSS کار میشود:
prefers-color-scheme
، که میتواند برای تشخیص اینکه آیا کاربر از سیستم درخواست کرده است که از یک تم رنگ روشن یا تیره استفاده کند، استفاده میشود. اشکال ردیابی برای این ویژگی افزودن پشتیبانی برای CSSprefers-color-scheme
media ویژگی برای کروم و فایرفاکس است.
مشترک شوید
میخواهید با ویدیوهای ما بهروز بمانید، سپس در کانال YouTube Developers Chrome مشترک شوید و هر زمان که ویدیوی جدیدی را راهاندازی کنیم، یک اعلان ایمیلی دریافت خواهید کرد.
من Pete LePage هستم، و به محض اینکه Chrome 74 منتشر شد، اینجا خواهم بود تا به شما بگویم -- چه چیزهای جدیدی در Chrome وجود دارد!