تزيين CookedElement لكل تغيير في الصفحة؟

يجب أن يعمل الكود الخاص بك بشكل جيد. لقد صادفت للتو خطأ في Discourse.

loadScript() لا يقوم بتعيين السمة async للبرامج النصية التي يقوم بتحميلها. لذلك، فإنه يرجع افتراضيًا إلى async="true" وهذا يفسد ترتيب التحميل الخاص بك. إنها نزوة في المتصفح. عليك فرض async="false" للبرامج النصية التي تم تحميلها باستخدام JS.

الإضافات أصغر، لذا فهي تُحمّل بشكل أسرع من الحزمة الرئيسية، ولكن كونها async يعني أنها لم تعد تحترم ترتيب التحميل - انتظر حتى يتم تحميل الحزمة الرئيسية وتنفيذها قبل التنفيذ.

ربما لم يلاحظ ذلك لأن loadScript غير متداخل في أي مكان في النواة، على حد علمي. عادةً ما تقوم بتجميع الملفات التي تحتاج إلى العمل معًا. لذا، للإجابة على سؤالك الآخر. لا، لا توجد وظائف Discourse تتعامل مع هذا النوع من الأشياء.

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

// This goes outside the decorator
const PLUGINS = {
  speed: "https://example.com/foo.js",
  skipBack: "https://example.com/bar.js",
  jumpForward: "https://example.com/baz.js"
};

// Then do your work inside the decorator
loadScript(MEDIA_ELEMENT_SRC)
  .then(() => loadScript(PLUGINS.speed))
  .then(() => loadScript(PLUGINS.skipBack))
  .then(() => loadScript(PLUGINS.jumpForward))
  .then(() => {
    audioplayers.forEach(function (el) {
      new MediaElementPlayer(el, MEDIA_ELEMENT_CONFIG);
    });
  });