في الآونة الأخيرة ، أفكر في كيفية دمج ملفات JS في الواجهة الأمامية. بالطبع ، لا يتضمن ملفات لا يمكن دمجها ، ولكن الملفات التي يمكننا دمجها. بعد التفكير في الأمر ، يجب أن يكون هناك ثلاث طرق فقط.
الطرق الثلاث هي كما يلي:
1. ملف كبير ، جميع JS تندمج في ملف كبير واحد ، وجميع الصفحات تشير إليه.
2. كل صفحة ملف كبير ، وتدمج كل صفحة لإنشاء الملف الكبير الخاص بك.
3. دمج عدة ملفات كبيرة مشتركة ، ودمج ملفات JS المشتركة المتعددة وفقًا للممارسة ، وتشير كل صفحة إلى ملفات كبيرة مشتركة.
بالإضافة إلى ذلك ، في رأيي ، لدى Merge غرضين:
1. لتقليل عدد الطلبات.
2. اعتبارات أمان الكود (كلما تم تقسيم الملفات ، كلما كان من الأسهل رؤيته بوضوح).
ملاحظة: لاحظ أن ما أتحدث عنه ليس ارتباكًا ، ما عليك سوى الاندماج
1. ملف كبير
بهذه الطريقة هي دمج جميع JS في ملف كبير بغض النظر عن الموقف ، وجميع الصفحات تشير إليها ، حتى لو لم يتم استخدام بعض التعليمات البرمجية.
ميزة:
(1). من السهل الاندماج وسهل الاستخدام.
(2). يمكن تحميل صفحات أخرى باستخدام تحسين ذاكرة التخزين المؤقت.
عيب:
(1). قد يتم تحميل الصفحة في رموز غير مستخدمة في هذه الصفحة.
لا تنطبق السيناريوهات:
(1). هذه الطريقة بالتأكيد ليست مناسبة لتطبيقات الويب الكبيرة ، وبغض النظر عن مقدار رمز الملف الواحد ، فإن تعقيد العمل لا يسمح لنا بالقيام بذلك (لم أر قط أن موقع الويب يقوم بذلك).
السيناريوهات المعمول بها:
(1). التطبيقات المختلطة ، سواء كانت تطبيقات هجينة للجوال أو التطبيقات الهجينة للكمبيوتر الشخصي (تطبيقات سطح المكتب ، على غرار إطار تطوير فريق Youdao Hex+Chromium+Nodejs) مناسبة للغاية ، ولن تكون هناك مشاكل في سرعة الطلب. يعد أمان رمز هذه التطبيقات الموجودة في رمز العميل أكثر أهمية.
ملاحظة: بالطبع ، أهم شيء هو أمن الواجهة الخلفية. بغض النظر عما إذا كانت الواجهة الأمامية متشققة ، وما إذا كانت الواجهة الخلفية تحسن التحقق من المدخلات ، وما إذا كانت تمنع تجاوز السلطة ، فإن الواجهة الخلفية هي المفتاح ، مما يعني أن القول "لا يثق بأي مدخلات من المستخدم".
2. ملفات كبيرة في كل صفحة
قم بدمج كل صفحة لإنشاء ملف كبير من JS الخاص بك ، وإنشاء دمج JS متعددة.
ميزة:
(1). تستخدم كل صفحة أهم JS ولن يكون هناك رمز غير ذي صلة.
عيب:
(1). هناك العديد من الصفحات ، وسيتم إنشاء عدة صفحات ، مما يؤدي إلى كمية كبيرة من التكرار في رمز JS المشترك.
(2). لا يمكن تحميل الجزء المشترك باستخدام تحسين ذاكرة التخزين المؤقت.
(3). الاندماج والاستخدام سيكون معقدا نسبيا.
أعتقد دائمًا أن هناك خطأ ما في هذه الطريقة. يمكن للتطبيقات الصغيرة التعامل معها مباشرة بملف كبير ، ولن تقوم التطبيقات الكبيرة بذلك ، ولا يمكن استخدامها في التطبيقات المختلطة. في هذه الحالة حيث يكون حجم حزمة التثبيت أمرًا مهمًا ، لا يمكن التسامح مع رمز زائد. عندما كنت أفكر في السيناريوهات المختلفة ، وجدت أنه يمكن حلها باستخدام الطرق أعلاه أو أدناه ، وكان ذلك أفضل ، لذلك أعتقد أن هذه الطريقة عديمة الفائدة.
3. دمج عدة ملفات كبيرة مشتركة
وفقًا للممارسة ، دمج ملفات كبيرة مشتركة متعددة (مثل تصنيف مكتبة التبعية) ، ودمج ملفات JS المطلوبة (مثل تصنيف رجال الأعمال) ، تشير كل صفحة إلى ملف كبير أو أكثر من ملفات JS في هذه الصفحة.
ميزة:
(1). يتم تحميل الجزء المشترك والمراجع إلى كل صفحة عالية قدر الإمكان دون التكرار.
عيب:
(1). ستكون هناك صفحات معينة أكثر أو أقل التي ستشير إلى التعليمات البرمجية غير المرغوب فيها ، والمشاركة ليست مشاركة كاملة.
السيناريوهات المعمول بها:
(1). كل من التطبيقات الكبيرة والصغيرة أكثر ملاءمة. قد يكون لكل صفحة العديد من الأجزاء الشائعة ، وستكون دمج الملفات المعقولة أمرًا بالغ الأهمية.
لخص
هذه الوثيقة هي مجرد فكرة وهي مجرد مناقشة عامة. هناك العديد من الطرق لدمج الملفات ، والتي يتم إنشاؤها ديناميكيًا بواسطة الواجهة الخلفية أو التي تم إنشاؤها مباشرة بواسطة الأدوات (Grunt+termjs). يتم تحديد الطرق الثلاثة المذكورة أعلاه للدمج أيضًا من خلال احتياجاتنا العملية.
الدمج مهم للغاية ، لكن لا ينصح بدمج جميع المستندات. لا يمكن دمج بعض المستندات. بعضها أفضل للوثائق الفردية ، ولكن ذلك يعتمد على السيناريو المحدد.
الطرق الثلاث المذكورة أعلاه لدمج ملف JS في الواجهة الأمامية هي كل المحتوى الذي أشاركه معك. آمل أن تتمكن من إعطائك مرجعًا وآمل أن تتمكن من دعم wulin.com أكثر.