التحديث الشهري لتطوير الويب 12-2018: WebP وحالة UX وتجربة منخفضة الضغط

نشرت: 2022-03-10
ملخص سريع ↬ بالنسبة لآخر تحديث شهري له في 2018 ، لخص أنسلم ما حدث في مجتمع تطوير الويب في الأسابيع القليلة الماضية. استعد لأخبار المتصفح ، والأدوات اليدوية ، والدروس المستفادة ، والقراءات المثيرة للتفكير.

إنه الإصدار الأخير من هذا العام ، وقد أذكّرت بشدة ما جلبه لنا عام 2018 ، وما حدث ، وكيف تطورت شبكة الإنترنت. دعونا نلخص ذلك ونذكرنا بما تعلمه كل منا هذا العام : ما هي الميزة الأكثر فائدة ، API ، المكتبة التي استخدمناها؟ وكيف تغيرنا شخصيا؟

بالنسبة لتحديث هذا الشهر ، قمت بجمع مجموعة أخرى من المقالات من أجلك. إذا لم تكن هذه مادة القراءة كافية بالنسبة لك حتى الآن ، فيمكنك دائمًا العثور على المزيد في الأرشيف أو قائمة Evergreen التي تحتوي على أهم المقالات منذ بداية قائمة قراءة تطوير الويب. أتمنى ألا تكون أيامك حتى نهاية العام مرهقة للغاية وأتمنى لك كل التوفيق. اراك السنة القادمة!

أخبار

  • أعلنت Microsoft للتو أنها ستغير إستراتيجية Edge الخاصة بها: ستستخدم Chromium كمحرك متصفح جديد لسطح المكتب بدلاً من EdgeHTML وقد توفر Microsoft Edge لنظام التشغيل macOS. سوف يساعدون أيضًا في تطوير محرك Blink من الآن فصاعدًا.
  • خرج Chrome 71 ويوفر دعمًا نسبيًا للوقت عبر واجهة برمجة تطبيقات التدويل. الجديد أيضًا هو أن تركيب الكلام يتطلب الآن تنشيط المستخدم.
  • تم إصدار Safari Technology Preview 71 ، مما يوفر supported-color-schemes في CSS وإضافة مصادقة الويب كميزة تجريبية.
  • سيقدم Firefox للمستخدمين قريبًا إعداد متصفح لحظر جميع طلبات الأذونات تلقائيًا. سيؤثر هذا على تشغيل مقاطع الفيديو تلقائيًا وإشعارات الويب وطلبات تحديد الموقع الجغرافي وطلبات الوصول إلى الكاميرا والميكروفون. تظهر الحاجة إلى الحظر التلقائي للطلبات مدى استخدام المطورين الخاطئين لهذه الأساليب. أخبار محزنة لأولئك الذين يعتمدون على مثل هذه الطلبات لخدماتهم ، مثل خدمات الاتصال WebRTC ، على سبيل المثال.

عام

  • لقد توصلنا أخيرًا إلى طرق للوصول إلى مواقع الويب واستخدامها في وضع عدم الاتصال بتقنية مذهلة. لكن الشيء الوحيد الذي نسيناه هو أنه على مدار الثلاثين عامًا الماضية ، علمنا الناس أن الويب متصل بالإنترنت ، لذلك لا يعرف معظم الناس أن الاستخدام غير المتصل موجود بالفعل. درس في تصميم تجربة المستخدم وأهمية تذكيرنا بتاريخ الوسيط الذي نبني من أجله.

UI / UX

  • كتب ماثيو ستروم عن أهمية إصلاح الأشياء لاحقًا وعدم محاولة أن تكون مثاليًا.
  • مورد ساخر إلى حد ما حول حالة تجربة المستخدم في عام 2019.
  • تعرض لنا Erica Hall أمثلة عن سبب كون معظم "تصميم UX" خرافة ولماذا لا يصنع التصميم منتجًا رائعًا فحسب ، بل أيضًا استراتيجية المنتج ونموذج العمل المناسبين. أفضل مثال على قراءة هذا الكتاب هو عندما كتبت إيريكا "فيرجن أمريكا. Rdio. قارئ جوجل. كومكاست. أي من هؤلاء يقدم تجربة جيدة؟ أي من هؤلاء لا يزال موجودًا؟ " حقيقة لا يمكنك تجاهلها ، ولحسن الحظ ، هذه ليست مقالة متشائمة ولكنها مثيرة للتفكير مع نصائح رائعة حول كيفية استخدام هذه المعرفة لتحسين منتجاتنا. مع الإستراتيجية والتصميم ونموذج الأعمال المناسب.
رسم توضيحي لامرأة لديها جهاز لوحي يشغل بعض برامج التصميم حيث يجب أن يكون وجهها.
بعد تنسيق ومشاركة 2،239 رابطًا مع 264،016 مصممًا حول العالم ، قام الأشخاص في UX Collective بعزل بعض الاتجاهات في ما تكتبه صناعة UX وتتحدث وتفكر فيه. (مصدر الصورة ؛ رسم توضيحي لكاميلا روزا)

الأدوات

  • يشرح Sandip Devarkonda كيف يمكننا إنشاء تطبيق في الوقت الفعلي باستخدام اشتراكات GraphQL على Postgres.

HTML و SVG

  • مايكل شارناجل يتحدث عن سبب وجوب التوقف عن تقريع الناس لأنهم يفضلون لغة ترميز على الأخرى.

إمكانية الوصول

  • يذكرنا سكوت أوهارا بمدى أهمية عدم نسيان الوظائف المتأصلة وإمكانية الوصول التي يوفرها الكثير عندما نسعى جاهدين لعناصر تحكم مصممة خصيصًا.

CSS

  • متغيرات بيئة CSS قادمة ، وإليك سبب حاجتنا إليها بالإضافة إلى الخصائص المخصصة.
  • يشرح Andy Bell كيف يمكننا استخدام خصائص CSS المخصصة لإدارة التدفق والإيقاع في تخطيطاتنا. مثال ممتاز يتجاوز استخدام الخصائص المخصصة لقيم اللون.

جافا سكريبت

  • Google على وشك أن تقدم لنا واجهة برمجة تطبيقات أخرى: تسمح Badging API لتطبيقات سطح المكتب على الويب بالإشارة إلى إشعارات جديدة أو ما شابه ذلك. المواصفات لا تزال قيد المناقشة ، وسيكونون سعداء لسماع أفكارك حول هذا الموضوع.
  • يشرح Hidde de Vries كيف يمكننا استخدام واجهات برمجة تطبيقات JavaScript API الحديثة لتمرير عنصر إلى مركز منفذ العرض.
  • تتيح ميزة " Background Fetch " الجديدة ، المتوفرة خلف العلامات في Chrome 71 ، إمكانية جلب الموارد التي تستغرق بعض الوقت للتحميل - الأفلام ، على سبيل المثال - في الخلفية.
  • يشرح Pete LePage كيف يمكننا استخدام Web Share Target API لتسجيل خدمة كهدف مشاركة.
  • هل ما زالت فكرة استخدام JavaScript لتحميل خطوط الويب فكرة جيدة؟ يشارك Zach Leatherman لماذا يجب أن نقرر كل حالة على حدة ولماذا من الأفضل غالبًا استخدام CSS الحديث وعرض font-display: swap; .
  • Doka هو محرر صور JavaScript جديد ومستقل يستحق أن يؤخذ في الاعتبار. على الرغم من أنه ليس منتجًا مجانيًا ، إلا أنه يتميز بطرق سهلة للغاية للتحرير مع تجربة مستخدم ممتعة ، ومن خلال دفع رسوم سنوية ، فإنك تضمن حصولك على إصلاحات الأخطاء والدعم.
  • تشارك "قوة مكونات الويب" المفاهيم الأساسية ، وكيفية البدء في استخدامها ، ولماذا استخدام عناصر HTML الخاصة بك بدلاً من لصق HTML ، ويمكن لفئات CSS ذات الصلة ومشغل JavaScript معًا تبسيط الأمور كثيرًا.

حماية

  • يشارك Scott Helme معلومات حول رأس أمان جديد يمكننا الاستفادة منه: يتيح Clear Site Data الموقع لمالكي المواقع مسح البيانات من ذاكرة التخزين المؤقت أو التخزين (المحلي / الجلسة / الدائم) أو ملفات تعريف الارتباط. قد يكون هذا مفيدًا لحذف البيانات الحساسة أو الخاصة المخزنة في localStorage أو ملفات تعريف الارتباط للمصادقة بسهولة.
  • نحن نعلم الآن أن استخدام rel=noopener يعد فكرة جيدة لعناصر الارتباط target=_blank . الآن يقوم Firefox بإجراء تجارب مع الاستبدال التلقائي لـ rel=noopener في المتصفح لضمان عدم إساءة استخدام هجوم الأمان.
  • يستكشف Terence Eden كيف أن الكثير من المواقع الكبيرة التي تقدم الدفع تتضمن جافا سكريبت غير مصدق وغير معتمد من أطراف ثالثة. يشرح بالتفصيل ما يعنيه هذا ، ولماذا هو ضار للغاية ، وكيف يمكننا حل المشكلة. ومع ذلك ، فإن حزمة Stripe JavaScript التي تحتاج إلى تضمينها لا تقدم تكامل الموارد الفرعية أيضًا.
  • حدثت حادثة أمنية أخرى مع حزمة npm شائعة جدًا: تم نشر event-stream برمز برمجي ضار يسرق محافظ Bitcoin معينة من أجهزة الكمبيوتر. يرجى التحقق من التبعيات على جهازك والتأكد من التحديث إلى أحدث إصدارات الحزمة. npm audit أيضًا في تحديد مثل هذه المشكلات.

خصوصية

  • هل لديك زوج او زوجة؟ أطفال؟ أقارب آخرين؟ إذن ، هذا الدليل الأساسي لحماية بيانات عائلتك هو شيء يجب عليك قراءته وتحويله إلى أفعال. الإنترنت ليس مكانًا آمنًا ، وتريد التأكد من أن أقاربك يفهمون ما يفعلونه - وأنت الذي يمكنك حمايتهم من خلال تعليمهم أو إعداد إعدادات افتراضية أفضل.

أداء الويب

  • كيف تقارن أحجام ملفات صور WebP بأفضل تحسينات JPEG أداءً؟ يقدم Daniel Aleksandersen الأرقام ويخلص إلى أن WebP يقوم بعمل رائع في التغلب على التنسيقات المحسنة الأخرى في كل مرة تقريبًا.
  • يوضح Ire Aderinokun كيف يمكننا استخدام صور WebP اليوم. أصبح هذا أكثر صلة الآن حيث يقدم Firefox دعم WebP في تصميماته الليلية ويدعم Edge التنسيق منذ الإصدار الأخير أيضًا.
  • تطلق وحدة السحابة في أمازون شرائح خادم تعتمد على الذراع ، وبهذا تكون قادرة على خفض التكاليف بنحو 45٪ (على سبيل المثال لخوادم الويب). هذا يعني أن استهلاك الطاقة أقل بكثير وأن الكفاءة الإجمالية أعلى مما يعد علامة جيدة لكوكبنا أيضًا. نحن بحاجة إلى المزيد من ترقيات البنية التحتية التطورية التي تقلل من تأثير التكنولوجيا على مناخنا.
مقارنة بين جودة صور JPG و WebP
يقدم WebP كلاً من الأداء والميزات. يشارك Ire Aderinokun سبب وكيفية استخدامه. (رصيد الصورة)

حياة العمل

  • تخبرنا شانا لينش ما الذي يجعل شخصًا ما قائدًا تجاريًا أخلاقيًا ، وما هي القيم المهمة ، وكيفية الوقوف في وضع مستقيم عندما تصبح الأمور صعبة ، وكيفية الاستعداد للمواقف غير المريحة مقدمًا.
  • يحاول Ozoemena Nonso شرح سبب عدم سعادتنا في كثير من الأحيان. لص سعادتنا لا نقارن أنفسنا بالآخرين. هو أننا نكافح من أجل الحصول على نموذج المقارنة الصحيح. نصيحة جيدة للغاية في الحياة إذا قارنت نفسك بالآخرين كثيرًا وشعرت أن سعادتك تعاني منها.
  • نصيحة غير شائعة إلى حد ما: لماذا قد يكون إجبار الآخرين على مغادرة منطقة الراحة الخاصة بهم فكرة سيئة.
  • ساندور دارجو يتحدث عن كيفية تمكنه من تجنب الإلهاءات أثناء وقت العمل وأداء وظيفته بشكل صحيح مرة أخرى.
  • يكتب بول روبرت لويد عن كتاب سينيد بولز "أخلاقيات المستقبل" ، وبينما يشرح ما يدور حوله ، يشير أيضًا إلى تحديات الأخلاق بمثال بسيط.
  • جيفري سيلفرشتاين مدرس وعانى كثيرًا في إيجاد الوقت لمشاريع جانبية أثناء العمل بدوام كامل. الآن وجد حلاً شاركه معنا في هذه المقالة الرائعة حول "كيفية تحقيق التوازن بين العمل بدوام كامل والمشاريع الإبداعية." قراءة ملهمة يمكنني أن أتعلق بها تمامًا.
  • يشارك Ben Werdmuller أفكاره حول سبب التقليل من قيمة الأعمال التجارية التي تعتمد على أسلوب الحياة بشكل كبير. ولكن ما هو أسلوب الحياة؟ يعرّفهم على أنهم شركات غير ممولة من المشاريع التي تسمح لأصحابها بالحفاظ على مستوى معين من الدخل ولكن ليس أكثر. كملاحظة جانبية ممتعة ، توضح هذه المقالة كيف أصبحت جوائز الإيجار المجنونة على الساحل الغربي للولايات المتحدة.
  • يشارك Jake Knapp كيف نجا من ست سنوات مع هاتف ذكي خالٍ من الإلهاء - لا رسائل بريد إلكتروني ، ولا إشعارات. ولديه بعض النصائح الرائعة لنا وتمرينًا لتجربته. لقد قمت مؤخرًا بنقل جميع تطبيقاتي إلى مجلد واحد على الشاشة الثانية للتأكد من أنني بحاجة إلى البحث عن التطبيق مما يعني عادةً أنني أريد حقًا فتحه وعدم القيام بذلك فقط لإلهاء نفسي.
  • كتب ريان أفينت عن سبب عملنا الجاد. هذا المقال مدروس جيدًا ويشرح لماذا نرى العمل على أنه أمر بالغ الأهمية ، ولماذا نقع في حبه ، ولماذا يتبنى أسلوب حياتنا ومجتمعنا العمل بجدية أكبر طوال الوقت.
رسم توضيحي ليد تمسك بهاتف. يظهر على الهاتف نافذة منبثقة تقول: انتظر جديًا؟ هل تريد حذف Gmail؟ هل انت مجنون؟
قضى جاك كناب ست سنوات مع هاتف خالٍ من الإلهاء: لا بريد إلكتروني ولا وسائط اجتماعية ولا متصفح. الآن يشاركك ما تعلمه منها وكيف يمكنك تجربة تجربتك منخفضة الضغط. (رصيد الصورة)

الذهاب إلى ما بعد ...

  • "لمن يعمل المصممون حقًا" هو تحفة فنية عن المسؤولية.
  • تشارك ماريان وولف بحثًا يُظهر أنه عندما يتخلص دماغنا من النصوص ، ليس لدينا الوقت لفهم التعقيد أو لفهم المشاعر أو لإدراك الجمال. اتجاه ازداد سوءًا خلال العقود الماضية.
  • أصدر المستثمرون العالميون الذين يديرون 32 تريليون دولار تحذيرًا صارخًا للحكومات في قمة المناخ للأمم المتحدة ، مطالبين بتخفيضات عاجلة في انبعاثات الكربون والتوقف التدريجي عن حرق الفحم. وقالوا إن من دون ذلك ، يواجه العالم انهيارًا ماليًا أسوأ عدة مرات من أزمة عام 2008.
  • من بعض النواحي ، قد يكون أسوأ انقراض جماعي على كوكب الأرض - منذ 250 مليون سنة ، في نهاية العصر البرمي - موازًا لتغير المناخ اليوم.