جافا سكريبت قوية: مطاردة أسطورة

غالبًا ما تسمى JavaScript "اللغة الأكثر شيوعًا" ، لكن يبدو أن لا أحد يتحدث عن تطوير JS على أنه "الأكثر أمانًا" ، وعدد المشاكل الكامنة في النظام البيئي كبير. كيفية الالتفاف حولهم بشكل فعال؟



فكر إيليا كليموف في هذا الأمر عندما كان الخطأ مكلفًا للغاية (حرفيًا) - ونتيجة لذلك قدم عرضًا تقديميًا عن HolyJS. ونظرًا لأن تعليقات الجمهور كانت ممتازة ، فقد قمنا الآن بإعداد نسخة نصية من هذا التقرير لـ Habr. تحت خفض - كل النص والفيديو.



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

أولئك الذين يعملون في الاستعانة بمصادر خارجية سوف يفهمون محتويات الشريحة التالية:



كل ما سنتحدث عنه ، بالطبع ، لا علاقة له بالواقع. كما يقولون في ساوث بارك ، كل الشخصيات مدللة وبائسة. وبطبيعة الحال ، تم الاتفاق مع ممثلي العملاء على الأماكن التي يوجد فيها اشتباه بانتهاك NDA.

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

لدي مشروع تعليمي لـ JavaScript Ninja. أحيانا أقوم بالوعود. أحيانا أتابعهم. وعدت في عام 2017 ، كجزء من مشروع تعليمي ، بتسجيل فيديو حول Kubernetes. أدركت أنني قد وعدت بهذا الوعد وسيكون من الجميل الوفاء به ، 31 ديسمبر. وجلست للتسجيل ( هنا هي النتيجة ).

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

منذ 31 كانون الأول (ديسمبر) ، فقد جزء من الأوامر. شطب لموسمية: ذهب الجميع لشرب الشاي. عندما استيقظ العميل في الفترة من 12 إلى 13 يناير ، كانت التكلفة الإجمالية للفيديو حوالي 500000 دولار. لم يكن لدي مثل هذا الإنتاج الباهظ التكلفة حتى الآن.



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

const config = { // … mysql: process.env.MYSQL_URI || 'mysql://localhost:3306/foo' // ... } 

كثير منكم ربما أيضا هذا السطر من التعليمات البرمجية في التكوينات الخاصة بك. أي أننا نأخذ التكوين من متغير mysql أو نأخذ قاعدة البيانات المحلية.

بسبب خطأ مطبعي في نظام النشر ، اتضح أنه تم تكوين النظام مرة أخرى كإنتاج ، ولكن قاعدة بيانات MySQL تستخدم قاعدة بيانات اختبار - محلية ، والتي كانت للاختبارات. هذه المرة تم إنفاق أموال أقل - 300000 دولار فقط. لحسن الحظ ، لم يكن هذا شركتي ، بل المكان الذي عملت فيه كمستشار مشارك.



قد تعتقد أن كل هذا لا يهمك كواجهة أمامية ، لأنني تحدثت عن DevOps (بالمناسبة ، أنا معجب باسم مؤتمر DevOops ، فهو يصف الجوهر تمامًا). لكنني سأخبرك عن موقف آخر.

هناك نظام يتحكم في الأوبئة البيطرية في إثيوبيا ، تم تطويره تحت رعاية الأمم المتحدة. يحتوي على أحد عناصر الواجهة عندما يأتي إلى شخص ، ويدخل الإحداثيات يدويًا: متى وأين حدثت حالات تفشي مرض معين.

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

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

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

يقدر إجمالي الخسارة بحوالي مليون دولار. في التقرير عن هذا الوضع ، كُتب "كنا ضحية لمجموعة من الظروف المؤسفة". لكننا نعرف أن النقطة هي جافا سكريبت!



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

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

بما أن الإغلاق حدث خارج عن المألوف ، بعد ذلك تم حل المشكلة في غضون سبع دقائق. ومع ذلك ، في هذه الدقائق السبع ، كانت تكلفة الغرامات التي يتعين دفعها 100000 دولار فقط.



لحسن الحظ ، كل هذا حدث في أكثر من عام. لكن هذه الحالات دفعتني إلى التفكير في مسائل الموثوقية وطرح سؤالين روسيين أصليين: من يقع اللوم وماذا أفعل؟

لماذا يحدث هذا: شباب النظام البيئي

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

علاوة على ذلك ، قبل عام ، عقدت مسابقة حيث كان عليّ حل مشاكل الخوارزميات كل يوم. منذ أن شعرت بالملل ، تمكنت من حلها باستخدام جافا سكريبت باستخدام البرمجة الوظيفية. لقد كتبت وظيفة خالصة تمامًا ، وفي Chrome الحالي ، عملت بشكل صحيح 1197 مرة ، وأسفرت 3 مرات عن نتيجة مختلفة. لقد كان مجرد خطأ بسيط في مُحسِّن TurboFan ، والذي وصل إلى Chrome الرئيسي.

بالطبع ، تم إصلاحه ، لكنك تفهم: هذا يعني ، على سبيل المثال ، أنه إذا مرت اختبارات الوحدة الخاصة بك مرة واحدة ، فإن هذا لا يعني على الإطلاق أنها ستعمل في النظام. أي أننا قمنا بتنفيذ الكود حوالي 1197 مرة ، ثم جاء المحسن وقال: "واو! ميزة الساخنة! دعونا تحسينه. " وفي عملية التحسين أدت إلى نتيجة خاطئة.

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

لفترة طويلة كان يُنظر إلى JavaScript على أنها لعبة. بسبب هذا (ليس لأننا لا نأخذ الأمر على محمل الجد) ، لا نزال نواجه مشاكل مع نقص الأدوات.

لذلك ، من أجل التعامل مع هذا السبب ، وهو المبدأ الأساسي الأساسي لكل ما سأتحدث عنه اليوم ، حاولت صياغة قواعد الموثوقية التي يمكنني فرضها في شركتي أو التحويل كمستشار للآخرين. كما يقول المثل ، "القاعدة رقم واحد هو عدم الحديث عن الموثوقية." ولكن أكثر خطورة ، ثم ...

قاعدة الموثوقية رقم 1: يجب أتمتة كل شيء يمكن تشغيله تلقائيًا

بما في ذلك ، بالمناسبة ، والتدقيق الإملائي:


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



الاستمرار في لعب Captain Evidence: ESLint. لن أسأل من الذي يستخدمه هنا ، لأنه ليس من المنطقي أن يرفع الجمهور بأكمله أيديهم (حسنًا ، آمل ذلك ولا أريد أن أكون بخيبة أمل). من الأفضل أن ترفع يديك الذين لديهم قواعد مكتوبة خاصة بهم في ESLint.

هذه القواعد هي واحدة من الطرق القوية للغاية لأتمتة الفوضى التي تحدث في المشاريع حيث يكتب الناس على مستوى المبتدئين وما شابه.

نحن جميعًا نريد مستوى معينًا من العزلة ، لكن عاجلاً أم آجلاً ينشأ موقف: "انظر ، هذا المساعد Vasya يباع في مكان ما في دليل مكونه بالقرب جدًا. لن أخرجها من القواسم المشتركة ، ثم سأفعلها ". الكلمة السحرية هي "لاحقًا". يؤدي ذلك إلى حقيقة أنه لا تبدأ التبعيات الرأسية في الظهور في المشروع (عندما تربط العناصر العليا العناصر السفلية ، لا تتدرج العناصر السفلية أبدًا خلف العناصر العليا) ، ولكن المكون A يعتمد على المكون B ، وهو في فرع مختلف تمامًا. نتيجة لذلك ، لا يتم نقل المكون A بسهولة إلى المكونات الأخرى.

بالمناسبة ، أعرب عن احترامي لـ Alfa-Bank ، ولديهم مكتبة مكتوبة بشكل جيد للغاية ومكون من مكونات React ، إنه لمن دواعي سروري أن أستخدمها بدقة من حيث تصميم جودة الكود.

تسمح لك قاعدة ESLint banal ، التي تتعقب مكان استيراد الكيانات منه ، بزيادة جودة الكود بشكل كبير وحفظ النموذج العقلي أثناء مراجعة الكود.

أنا بالفعل من وجهة نظر العالم الأمامي القديم. في الآونة الأخيرة ، في منطقة خاركوف ، أكملت شركة PricewaterhouseCoopers الكبيرة والخطيرة دراسة ، ويبلغ متوسط ​​عمر البائع الأمامي حوالي 24-25 عامًا. من الصعب علي التفكير في كل هذا ، أريد التركيز على منطق العمل أثناء مراجعة طلب السحب. لذلك ، يسرني أن أكتب قواعد ESLint حتى لا أفكر في مثل هذه الأشياء.

قد يبدو أنه يمكنك ضبط القواعد المعتادة لهذا ، لكن الواقع عادة ما يزعجك أكثر ، لأنه يتضح أن بعض محددات Redux مطلوبة من مكون التفاعل (للأسف ، لا تزال حية). وهذه المحددات موجودة في مكان ما في تسلسل هرمي مختلف تمامًا ، لذلك "../../../ ..".

أو ما هو أسوأ من ذلك ، اسم مستعار webpack ، الذي يكسر حوالي 20 ٪ من الأدوات الأخرى ، لأنه لا يفهم الجميع كيفية التعامل معها. على سبيل المثال ، يا حبيبي التدفق.

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

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



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

الكتابة

إذا كنت لا تكتب TypeScript ، فقد ترغب في التفكير فيه. لا أحب TypeScript ، وأنا تقليدياً تدفق عالي ، لكننا سنتحدث عن هذا لاحقًا ، لكن من المرحلة سأقوم بالترويج للحل السائد بإشمئزاز.

لماذا هذا أجرت لجنة برنامج TC39 مؤخرًا نقاشًا كبيرًا حول المكان الذي تذهب إليه اللغة عمومًا. استنتاج مضحك للغاية توصلوا إليه: في TC39 هناك دائمًا "بجعة وسرطان ورمح" ، والتي تجر اللسان في اتجاهات مختلفة ، ولكن هناك شيء واحد يريده الجميع وهو الأداء دائمًا.

أصدر TC39 بشكل غير رسمي ، في مناقشة داخلية ، هذا الخطاب: "سنجعل JavaScript دائمًا حتى يظل منتجًا ، وسيأخذ أولئك الذين لا يرغبون في ذلك بعض اللغات التي يتم تجميعها في JavaScript."

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



كانت هناك بالفعل تقارير عن GraphQL في المؤتمر ، وبالتالي لا يوجد سوى حد واحد على وجه التحديد لمسألة الموثوقية: إذا كنت تستخدم ، على سبيل المثال ، Express GraphQL ، ثم في كل مرة بالإضافة إلى محلل محدد ، يمكنك تعليق بعض المدققين الذين يسمحون لك بتشديد متطلبات القيمة مقارنة بـ الأنواع القياسية من GraphQL.

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

بالنسبة إلى هؤلاء المدققين ، الذين يفرضون المزيد من الدقة: استخدامهم فكرة جيدة وسليمة ، لا تستخدمهم كما هو مقترح ، على سبيل المثال ، بواسطة GraphQL. تجد نفسك مرتبطًا جدًا بـ GraphQL كمنصة. في الوقت نفسه ، يلزم التحقق من الصحة في مكانين في نفس الوقت: على الواجهة الأمامية قبل إرسال البيانات وتلقيها ، وعلى الواجهة الخلفية.

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

العقود

لقد تحدثت بالفعل عن شباب النظام البيئي. لقد وجدت برمجة العقود لأكثر من 25 عامًا كنهج أساسي. إذا كنت تكتب على TypeScript ، فاخذ io-ts ، وإذا كنت تكتب على Flow ، مثلي ، فاخذ عقدًا مكتوبًا ، وستحصل على شيء مهم للغاية: القدرة على وصف عقود وقت التشغيل التي تستمد منها الأنواع الثابتة.



لا يوجد شيء أسوأ للمبرمج من وجود أكثر من مصدر للحقيقة. أعرف الأشخاص الذين فقدوا مبالغ مكونة من خمسة أرقام بالدولار لمجرد أن نوعهم موصوف بلغة ذات كتابة ثابتة (استخدموا TypeScript - جيدًا ، بالطبع ، هذه مجرد مصادفة) ونوع وقت التشغيل (يبدو أنه استخدم tcomb ) مختلفة قليلا.

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

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

لماذا يحدث هذا: العزلة

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

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

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

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

تتضح مشكلة العزلة بشكل جيد من خلال شعار أحد المشاريع التي تحل هذه المشكلة جزئيًا. هذا ليرنا.



Lerna هي أداة ممتازة لإدارة حزم npm متعددة في مستودع. عندما يكون لديك مطرقة في يديك ، يصبح كل شيء بشكل مثير للريبة مثل الظفر. عندما يكون لديك نظام يشبه يونيكس مع الفلسفة الصحيحة ، يصبح كل شيء بشكل مثير للريبة مثل الملف. يعلم الجميع أنه على أنظمة يونيكس ، كل شيء ملف. هناك أنظمة يتم فيها الوصول إلى أعلى درجة (قلت تقريبًا "لدرجة العبث") ، مثل الخطة 9 .

أعلم أن المنظمات ، بعد أن توليت ضمان موثوقية التطبيق العملاق ، توصلت إلى فكرة بسيطة واحدة: كل شيء عبارة عن حزمة.



عندما تقوم بإخراج عنصر من الوظائف ، سواء كان مكونًا أو شيءًا آخر ، في حزمة منفصلة ، فإنك تقوم تلقائيًا بتوفير طبقة عزل. فقط لأنك لا تستطيع الوصول إلى آخر عادة من حزمة واحدة. وأيضًا لأن نظام العمل مع الحزم التي يتم جمعها في مستودع أحادي عبر npm-link أو Yarn Workspaces ، فظيع للغاية ولا يمكن التنبؤ به من حيث كيفية تنظيمه داخليًا بحيث لا يمكنك حتى اللجوء إلى الاختراق وتوصيل نوع من الملف من خلال "node_modules شيء" ، وذلك ببساطة لأن مختلف الناس لديهم كل شيء في هيكل مختلف. هذا يعتمد بشكل خاص على إصدار الغزل. هناك ، في أحد الإصدارات ، غيّروا بهدوء آلية آلية تنظيم عمل Yarn Workspaces مع الحزم.

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

إنها تتعلق بعزل كل طلب محدد. في PHP ، لدينا ، في المتوسط ​​، في المستشفى ، يتم عزل جميع الطلبات ، والتفاعل بينها فقط إذا كنت لا تستخدم أي انحرافات مثل Shared Memory ، لا يمكننا ذلك ، كل شيء على ما يرام ، سلمي ، جميل. في جوهرها ، يضيف cls-hooked نفس الشيء ، مما يسمح لك بإنشاء سياقات التنفيذ ، ووضع المتغيرات المحلية فيها ، والأهم من ذلك ، أن تدمر هذه السياقات تلقائيًا حتى لا تستمر في تناول ذاكرتك.

cls-hooked async_hooks, node.js , , . , .

, , node-.

#2: «»

, , . , JavaScript — , . grep-.

ما هذا vim. , - Language Server, - — , , grep. , , . grep- , grep. , , .

Sequelize . ORM . user.getProjects(). , getProjects? .



, Sequelize, , hasMany, belongsToMany. , , , . , .

code review, , . . — , .

, : «merge request 20 — 30 , merge request 5000 — looks good to me». , .

JavaScript Ninja , , , junior-, . « react redux», 8000 , 10 000 » , , « ». , , « », , merge request .

, , merge request , , Linux. , , -. , git. , . , , . .

- . . - , , - .

, . Microsoft Surface Linux, . , , . - .

:

« », « ». , React. React, Fiber — .

, Fiber ( OCaml) JavaScript, . , . , — , proposal, JavaScript. Scheduler — proposal stage 0.

, React , - . , : , DOM. — . , .



— Vue.js. Vue? , . Vue, , , .

Vue React. , Vue, , React.

. Vue , state, , state , . , . Vue .

. , , Web Components c , , . : , pop-up, , , - . — .

Vue — scoped slots. , - . scoped slot — , . . React Render Proper: , . Vue , -.

-, Vue . Vue : , child-, , scoped slots, forceUpdate. , child . .

React . , , shouldComponentUpdate(), . Vue , , , , . . Vue. , - .



— Jest . Facebook. JavaScript: , , . . , .

, ECMAScript 2015 . , if, require. Require , . , , , . Jest Babel Require .

NGS- Node, proposal, . JavaScript : Require, . . , Jest c NGS- , , . , .

, , - . , Inversion of Control - Dependency Injection-.

IoC/DI

, , . Angular IoC/DI. React … , , React Vue? dan.church , evan.church .

, , React Dependency Injection, - . Vue inject provide. .

, , . , NestJS . InversifyJS . TypeScript, , , JavaScript. , .



Typescript, Inversify. , : inject (TYPES.Weapon) katana: Weapon. , , TYPES.Weapon Weapon? — .

, , , TypeScript ( Flow ) , inject dependency injection runtime, .

« »? Weapon , , TypeScript , . TypeScript , first-class citizen JavaScript, . , , runtime , katana Weapon. .

- C++, , , RTTI: run-time type information, , . C# Java reflection, . TypeScript, « », , RTTI.

. . Vue Vue 3 TypeScript, , Vue TypeScript , Microsoft: « , TypeScript, ?» , Vue, : props, this. , props , this, . TypeScript , . .

Microsoft , : Vue , Angular, . , TypeScript. React, , .

, . , Dart, mirrors, , Flutter. mirrors, , , .

Inversify, Babel-, , , , runtime-, , .

: . . , , , . , V8 .

V8 , . , , V8, , , . , V8 , TypeScript.

. , , .

#3: «» , «»

«» «» , , «» — , . , Vue, . - , - props' .

. typed-css-modules? : CSS, CSS Modules, .



typed-css-modules , , css-, .

12 , CSS- , . 11 12 undefined, CSS- , , , , undefined, .



Yeoman , , , . , , . Angular CLI, Blueprints (, Angular, GDG SPB , , ).




Anguar , , . .

, «» , «» — , . , «» — . , , , , , , .

, — . junior', , , , . , , React- .

, , , - ESLInt, - , , .

, , . , NestJS Sails.js .



, , , , , - -. Sails ORM, . Waterline — , . , Sails.js . blueprint , . , , .



Nest, — , . Dependency Injection, , middleweight .

. , , , , , : « - ?»

Angular, — , , dependency injection, , .

- Vue (, ), , Vue . Vue, - , — Nest. , , , , TypeScript.

:

, JavaScript. , , , , , .

— , , , , , : - . - , — .



Grafana, , — . , - , . speech recognition API Microsoft, , , 20 . , , , -.



: CI/CD. GitLab, , . GitLab, , JavaScript-friendly environment , , .

. , , … , -.



Blue/Green deployment: - , , . , , !

• JavaScript , , . , , , JavaScript GitHub. — , , , .
• JavaScript , ( , ). « , ». , . DI , « ?»
• , . TypeScript, Flow, Rizen — , runtime exception, , .
  
  , — -, .

HolyJS, : HolyJS 24-25 . — , ( MobX) ( Chrome DevTools). — .