في الإصدار 71 من Chrome، أضفنا إمكانية استخدام ما يلي:
- أصبح عرض الأوقات النسبية جزءًا من واجهة برمجة التطبيقات
Intl. - تحديد جانب النص الذي يجب أن يظهر عليه التسطير للنص الذي يتدفق عموديًا
- طلب تفعيل المستخدم قبل استخدام واجهة برمجة التطبيقات لميزة تحويل الكلام إلى نص
وهناك الكثير غير ذلك.
اسمي بيت ليبيه. لنطّلِع على الميزات الجديدة للمطوّرين في Chrome 71.
سجلّ التغييرات
لا يتناول هذا المقال سوى بعض الميزات الرئيسية، ويمكنك الاطّلاع على الروابط أدناه للاطّلاع على التغييرات الإضافية في الإصدار 71 من Chrome.
- قائمة التغييرات في مستودع مصدر Chromium
- تعديلات ChromeStatus.com بشأن الإصدار 71 من Chrome
- الميزات التي سيتم إيقافها نهائيًا أو إزالتها في الإصدار 71 من Chrome
عرض الأوقات النسبية باستخدام Intl.RelativeTimeFormat()
تستخدِم العديد من تطبيقات الويب عبارات مثل "أمس" أو "بعد يومَين" أو "قبل ساعة" لتحديد وقت حدوث حدث أو وقت حدوثه بدلاً من عرض التاريخ والوقت الكاملَين.
أصبح عرض الأوقات النسبية شائعًا جدًا لدرجة أنّ معظم مكتبات التاريخ/الوقت الشائعة توفّر دوالًا مترجَمة لتنفيذ ذلك نيابةً عنا. في الواقع، Moment JS هو كل تطبيق ويب أُنشئه تقريبًا من أولى المكتبات التي أضيفها صراحةً لهذا الغرض.
يقدّم الإصدار 71 من Chrome Intl.RelativeTimeFormat()، الذي
يحوّل العمل إلى محرك JavaScript، ويفعّل التنسيق المترجَم للوقت
النسبي. يمنحنا ذلك تحسينًا بسيطًا في الأداء، ويعني أنّنا لن نحتاج
إلى هذه المكتبات إلا كبديل لعناصر polyfill عندما لا يتيح المتصفّح واجهات برمجة التطبيقات الجديدة
بعد.
const rtf = new Intl.RelativeTimeFormat('en');
rtf.format(3.14, 'second');
// → 'in 3.14 seconds'
rtf.format(-15, 'minute');
// → '15 minutes ago'
إنّ استخدام هذه الطريقة بسيط، ما عليك سوى إنشاء مثيل جديد وتحديد اللغة، ثم استدعاء التنسيق مع الوقت النسبي. يمكنك الاطّلاع على مشاركة "ماتياس" بعنوان
Intl.RelativeTimeFormat API
للحصول على التفاصيل الكاملة.
تحديد موضع التسطير للنص العمودي
عند عرض نص صيني أو ياباني في تدفق عمودي، قد لا تتوافق المتصفحات مع مكان وضع التسطير، فقد يكون إلى اليسار أو على اليمين.
في الإصدار 71 من Chrome، تقبل السمة text-underline-position الآن left أو
right كجزء من مواصفات زخرفة النصوص في CSS3. تضيف
مواصفات زخرفة النصوص في CSS3 عدة سمات جديدة تسمح
بتحديد أشياء مثل نوع الخط الذي تريد استخدامه،
الأسلوب واللون و
الموضع.
.left {
text-underline-position: left;
}
.right {
text-underline-position: right;
}
تتطلب ميزة تركيب الكلام تفعيل المستخدم
لقد فوجئنا جميعًا عندما ندخل إلى موقع إلكتروني ويبدأ فجأة بالتحدّث إلينا. سياسات التشغيل التلقائي: تمنع هذه السياسات المواقع الإلكترونية من تشغيل الملفات الصوتية أو ملفات الفيديو التي تتضمّن صوتًا تلقائيًا. حاولت بعض المواقع الإلكترونية التحايل على ذلك باستخدام واجهة برمجة التطبيقات لإنشاء المحتوى الصوتي بدلاً من ذلك.
بدءًا من الإصدار 71 من Chrome، تتطلّب واجهة برمجة التطبيقات لإنشاء الكلام الآن نوعًا من تفعيل المستخدم على الصفحة قبل أن تعمل. ويتوافق ذلك مع سياسات التشغيل التلقائي الأخرى. وإذا حاولت استخدامها قبل أن يتفاعل المستخدم مع الصفحة، سيؤدي ذلك إلى ظهور خطأ.
const utterance = new window.SpeechSynthesisUtterance('Hello');
utterance.lang = lang || 'en-US';
try {
window.speechSynthesis.speak(utterance);
} catch (ex) {
console.log('speechSynthesis not available', ex);
}
ليس هناك أسوأ من الانتقال إلى موقع ما ومفاجأة لك وزملائك في العمل.
وغير ذلك
هذه ليست سوى بعض التغييرات في الإصدار 71 من Chrome للمطوّرين، وبالطبع، هناك الكثير من التغييرات الأخرى.
- يمكن الآن تخصيص طريقة
Element.requestFullscreen()على Android، وهي تتيح لك الاختيار بين إظهار شريط التنقّل أو الوضع المجسم بالكامل الذي لا تظهر فيه أي عناصر تحكُّم لوكيل المستخدم إلى أن يتم تنفيذ إيماءة المستخدم. - تم تغيير وضع بيانات الاعتماد التلقائية لطلبات نصوص وحدة البرنامج،
من
omitإلىsame-origin. - وبذلك يصبح Chrome مضمّنًا مع
مواصفات الإصدار 1 من Shaadow DOM،
يحسب Chrome 71 الآن دقة الفئتَين الزائفتَين
:host()و:host-context()بالإضافة إلى الوسيطات في::slotted().
فيديوهات Chrome DevSummit
إذا لم تتمكن من حضور قمة مطوّري برامج Chrome أو إذا حضرتها ولكنك لم تتمكّن من الاطّلاع على كل المحادثات، يمكنك الاطّلاع على قائمة تشغيل قمة مطوّري برامج Chrome لعام 2018 على قناتنا على YouTube.
شرحت "إيفانا" و"فيل" بعض الأساليب الرائعة لاستخدام مهام الخدمة في مقالة إنشاء تطبيقات أسرع وأكثر مرونة باستخدام مهام الخدمة.
تحدّثت "ماريكو" و"جاك" عن كيفية إنشاء Squoosh في تطبيقات الويب المعقدة التي تستخدم JavaScript بشكل كبير، وتجنُّب البطء.
اطّلِع على بعض الأساليب الرائعة التي تُساعدك في تحسين أداء موقعك الإلكتروني إلى أقصى حدّ في مقالة أساسيات السرعة: الأساليب الرئيسية للمواقع الإلكترونية السريعة.
أسقط جاسر الكعكة. تتوفّر أيضًا العديد من الفيديوهات الرائعة الأخرى في ملفّ الموسيقى قائمة تشغيل Chrome DevSummit 2018، لذا ننصحك بمشاهدتها.
اشتراك
إذا أردت البقاء على اطّلاع على فيديوهاتنا، ما عليك سوى الاشتراك في قناتنا على YouTube Developers في متصفّح Chrome، وستتلقّى إشعارًا عبر البريد الإلكتروني عندما ننشر فيديو جديدًا.
اسمي "بيت ليبيت"، وسأطلعك على الميزات الجديدة في Chrome فور طرح الإصدار 72.