التحديث الشهري لتطوير الويب 6-2018: التعقيد ، DNS عبر HTTPS ، ودفع الإخطارات

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

كتب جيفري زيلدمان مقالًا مثيرًا للاهتمام حول هذا الموضوع: يوضح "عبادة المركب" كيف نفقد أنفسنا في تفاصيل غير ضرورية وغالبًا ما نحاول الإفراط في التفكير في المشكلات . يعجبني التحدي المتمثل في بناء أنظمة ليست معقدة للغاية ولكنها تظهر قدرًا لائقًا من المسؤولية (عندما يتعلق الأمر بالأخلاق والخصوصية والأمان وتجربة مستخدم رائعة وأداء) وتعمل بشكل موثوق (الاختبارات وعمليات النشر والتوافر و الأداء مرة أخرى). أعتقد أن مشكلة إيجاد التوازن الصحيح لن تختفي قريبًا. التعقيد موجود في كل مكان - نحتاج فقط إلى تحديد ما إذا كان التعقيد مفيدًا أم أنه تمت إضافته لمجرد أنه كان أسهل أو لأننا كنا نبالغ في هندسة المشكلة الأصلية.

أخبار

• تم الكشف عن الإصدار 12 من Safari المرتقب في مؤتمر WWDC التابع لشركة Apple. إليك الجديد: الرموز الموجودة في علامات التبويب ، وكلمات المرور القوية ، بالإضافة إلى عنصر تحكم منشئ كلمة المرور عبر سمات HTML بما في ذلك التحكم في المصادقة الثنائية ، وعارض النماذج ثلاثية الأبعاد والواقع المعزز ، وواجهة برمجة تطبيقات Fullscreen على أجهزة iPad ، font-display ، ومهم جدًا ، برنامج منع التتبع الذكي 2.0 الذي يعد أكثر تقييدًا من أي وقت مضى وقد يكون له تأثير كبير على وظائف مواقع الويب الحالية.
• أصبحت مكتبة Puppeteer للتشغيل الآلي لمتصفح Chrome بدون رأس الآن في الإصدار 1.5. إنه يجمع سياقات المستعرض لعزل ملفات تعريف الارتباط والبيانات الأخرى التي تتم مشاركتها عادةً بين الصفحات ، ويمكن الآن استخدام العمال للتفاعل مع عمال الويب أيضًا.
• أصدرت Google Lighthouse 3.0 ، الإصدار الرئيسي الثالث من أداة تحليل الأداء الخاصة بها والتي تتميز بواجهة تقرير جديدة ، وبعض التغييرات في النقاط ، وتصدير CSV ، وقياس First Contentful Paint.
• يتوفر Chrome 67 هنا ، حيث يجلب تطبيقات الويب التقدمية إلى سطح المكتب ، بالإضافة إلى دعم Generic Sensor API ، وتوسيع واجهة برمجة تطبيقات إدارة بيانات الاعتماد لدعم مصادقي U2F عبر USB.
• لقد رأينا بعض التغييرات في واجهات أمان المتصفحات خلال الأشهر الماضية. أولاً ، أكدوا على المواقع التي تقدم اتصالاً آمنًا (HTTPS). ثم قرروا الإشارة إلى المواقع غير الآمنة ، والآن أعلن Chrome عن تغييرات جديدة قادمة في الخريف والتي ستجعل HTTPS الافتراضي من خلال تمييز صفحات HTTP على أنها "غير آمنة".

عام

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

UI / UX

• Cool Backgrounds هو مشروع جانبي رائع بواسطة Moe Amaya. إنه منشئ عبر الإنترنت للخلفيات متعددة الأضلاع ذات التدرجات اللونية التي يمكن أن تولد الكثير من المتغيرات والأشكال. جميل ببساطة.

الأدوات

• يشارك Ben Frain بعض تقنيات تحرير النص المفيدة المتوفرة في جميع برامج تحرير التعليمات البرمجية الحديثة تقريبًا.

حماية

• مع اكتساب هجمات الأمان عبر DNS شعبية ، تزداد أهمية DNS عبر HTTPS. يشرح لين كلارك التكنولوجيا برسومات كاريكاتورية لتسهيل فهمها.
• يقوم Windows Edge الآن بمعاينة دعم ملفات تعريف الارتباط same-site . السمة الخاصة بإغلاق ملفات تعريف الارتباط أكثر متاحة بالفعل في Firefox و Chrome ، لذا فإن Safari هو المتصفح الرئيسي الوحيد الذي لا يزال بحاجة إلى تنفيذه ، لكنني أعتقد أنه سيهبط في Tech Preview الخاصة بهم قريبًا جدًا.

خصوصية

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

أداء الويب

• طلبت KeyCDN من 15 شخصًا يعرفون الكثير عن أداء الويب مشاركة أفضل نصائحهم مع القراء. لقد شاركوا الآن هذه المقالة التي تحتوي على الكثير من نصائح الأداء المفيدة لعام 2018 ، بما في ذلك بضع كلمات بنفسي.
• اكتشف Stefan Judis أنه يمكننا بالفعل تحميل وحدات ECMA Script في Chrome 66 مسبقًا عن طريق إضافة link rel="modulepreload" .

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

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

جافا سكريبت

• تم التنمر على JavaScript مؤخرًا من قبل الأشخاص الذين يفضلون Elm أو Rust أو TypeScript أو Babel أو Dart. لكن JavaScript بالتأكيد ليس أسوأ ، كما يشرح Andrea Giammarchi بأمثلة رائعة. تعد هذه المقالة أيضًا قراءة رائعة لكل من يستخدم إحدى هذه اللغات الأخرى حيث تُظهر بعض المزالق التي يجب أن نكون على دراية بها.
• بالنسبة للعديد من المشاريع ، نريد استخدام التحليلات أو البرامج النصية الأخرى التي تجمع المعلومات الشخصية. مع تطبيق اللائحة العامة لحماية البيانات (GDPR) ، أصبح هذا الأمر أكثر صعوبة. Yett هي أداة JavaScript لطيفة تتيح لك منع تنفيذ مثل هذه الموارد حتى يوافق عليها المستخدم.
• أنشأ رايان ميلر منشورًا جديدًا بعنوان "The Frontendian" ، وهو يتميز بواحد من أفضل التفسيرات والأدلة إلى CORS التي صادفتها حتى الآن.
• أنشأ الأشخاص في Microsoft صفحة تجريبية تفاعلية لطيفة لإظهار ما يمكن أن تبدو عليه إشعارات الدفع عبر الويب ويجب أن تبدو عليه. إذا لم تكن قد استوعبت التكنولوجيا بعد ، فهي مقدمة رائعة لكيفية عمل كل شيء وكيفية إنشاء واجهة لا تزعج المستخدمين.
• Filepond هي مكتبة JavaScript لتحميل الملفات. يبدو رائعًا ويأتي مع الكثير من مهايئات React و Vue و Angular و jQuery.
• تم إصدار React 16.4 وإحضار ميزة إلى المكتبة: Pointer Events. ستسهل التعامل مع تفاعلات المستخدم وقد طُلبت بالفعل لفترة طويلة.

CSS

• يشارك Oliver Schondorfer كيفية البدء بالخطوط المتغيرة على الويب وكيف يمكننا تصميمها باستخدام CSS. ملخص كامل للأشياء التي تحتاج إلى أخذها في الاعتبار بالإضافة إلى المخاطر المحتملة.
• مع دعم macOS Mojave القادم لـ "الوضع المظلم" ، سيبدأ Safari في ضبط لون خلفية مواقع الويب تلقائيًا على اللون الأسود إذا لم يتم تعيين background-color بشكل صريح. هذا تذكير رائع بأن المتصفحات يمكنها ضبط وتعديل أنماطها الافتراضية وأننا بحاجة إلى ضبط الإعدادات الافتراضية لموقعنا بعناية. ما زلت آمل أن يتعرض "الوضع المظلم" لاستعلام وسائط CSS حتى نتمكن من إضافة دعم رسمي له.
• تشارك Rafaela Ferro كيفية استخدام CSS Grid لإنشاء معرض صور لا يبدو جيدًا فحسب ، بل رائعًا بالفعل. تحتوي هذه المقالة على إجابات للعديد من الأسئلة التي أتلقاها بانتظام عند الحديث عن تخطيط الشبكة.
• يشرح Marcin Wichary كيف يمكننا إنشاء سمة داكنة في وقت قصير باستخدام خصائص CSS المخصصة الحديثة.

حياة العمل

• كتب أنطون ستين عن الآثار الأخلاقية لتطبيقاتنا. تفسير هادف لانتهاء أوقات "التحرك بسرعة وكسر الأشياء" بالتأكيد لأننا نتعامل مع الذكاء الاصطناعي والشبكات الاجتماعية التي تؤثر على حياة الأشخاص ومسائل الخصوصية التي تفرضها اللائحة العامة لحماية البيانات.
• يحتوي Basecamp الآن على نوع مخطط جديد لعرض حالة المشروع: يضيف ما يسمى بـ "مخطط التل" سياق أفضل مما يمكن لشريط التقدم البسيط القيام به.
• يشارك Ben Werdmuller أفكاره حول السير الذاتية وكيف أنها تفشل دائمًا في التعبير عن هويتك وماذا تفعل ولماذا يجب أن يتم تعيينك.

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

أتمنى لك يوما عظيما!

- أنسلم