multiple imports optimized

src/components/images/imageLoader.js

@@ -124,16 +124,14 @@ import './style.css';
 
     export function lazyChildren(elem) {
         if (userSettings.enableBlurhash()) {
-            const lazyElems = Array.from(elem.querySelectorAll('.lazy'));
-
-            lazyElems.forEach((lazyElem) => {
+            for (const lazyElem of elem.querySelectorAll('.lazy')) {
                 const blurhashstr = lazyElem.getAttribute('data-blurhash');
                 if (!lazyElem.classList.contains('blurhashed', 'non-blurhashable') && blurhashstr) {
                     itemBlurhashing(lazyElem, blurhashstr);
                 } else if (!blurhashstr && !lazyElem.classList.contains('blurhashed')) {
                     lazyElem.classList.add('non-blurhashable');
                 }
-            });
+            }
         }
 
         lazyLoader.lazyChildren(elem, fillImage);

src/components/libraryoptionseditor/libraryoptionseditor.js

@@ -364,8 +364,9 @@ import '../../elements/emby-input/emby-input';
         currentAvailableOptions = null;
         const isNewLibrary = libraryOptions === null;
         isNewLibrary && parent.classList.add('newlibrary');
-        const response = await fetch('components/libraryoptionseditor/libraryoptionseditor.template.html');
-        const template = await response.text();
+
+        const { default: template } = await import('./libraryoptionseditor.template.html');
+
         parent.innerHTML = globalize.translateHtml(template);
         populateRefreshInterval(parent.querySelector('#selectAutoRefreshInterval'));
         const promises = [populateLanguages(parent), populateCountries(parent.querySelector('#selectCountry'))];

src/components/metadataEditor/metadataEditor.js

@@ -18,6 +18,7 @@ import '../../assets/css/clearbutton.scss';
 import '../../assets/css/flexstyles.scss';
 import ServerConnections from '../ServerConnections';
 import toast from '../toast/toast';
+import { appRouter } from '../appRouter';
 
 /* eslint-disable indent */
 
@@ -244,9 +245,7 @@ import toast from '../toast/toast';
         if (parentId) {
             reload(context, parentId, item.ServerId);
         } else {
-            import('../appRouter').then((appRouter) => {
             appRouter.goHome();
-            });
         }
     }
 

src/components/recordingcreator/recordingcreator.js

@@ -17,6 +17,7 @@ import '../formdialog.css';
 import './recordingcreator.css';
 import 'material-design-icons-iconfont';
 import ServerConnections from '../ServerConnections';
+import { playbackManager } from '../playback/playbackmanager';
 
 let currentDialog;
 let closeAction;
@@ -117,7 +118,6 @@ function reload(context, programId, serverId, refreshRecordingStateOnly) {
 
 function executeCloseAction(action, programId, serverId) {
     if (action === 'play') {
-        import('../playback/playbackmanager').then((playbackManager) => {
         const apiClient = ServerConnections.getApiClient(serverId);
 
         apiClient.getLiveTvProgram(programId, apiClient.getCurrentUserId()).then(function (item) {
@@ -126,7 +126,6 @@ function executeCloseAction(action, programId, serverId) {
                 serverId: serverId
             });
         });
-        });
         return;
     }
 }

src/components/slideshow/slideshow.js

@@ -13,6 +13,9 @@ import './style.css';
 import 'material-design-icons-iconfont';
 import '../../elements/emby-button/paper-icon-button-light';
 import ServerConnections from '../ServerConnections';
+// eslint-disable-next-line import/named, import/namespace
+import { Swiper } from 'swiper/swiper-bundle.esm';
+import 'swiper/swiper-bundle.css';
 
 /**
  * Name of transition event.
@@ -301,7 +304,6 @@ export default function (options) {
             slides = currentOptions.items;
         }
 
-        import('swiper').then(({default: Swiper}) => {
         swiperInstance = new Swiper(dialog.querySelector('.slideshowSwiperContainer'), {
             direction: 'horizontal',
             // Loop is disabled due to the virtual slides option not supporting it.
@@ -339,7 +341,6 @@ export default function (options) {
         if (useFakeZoomImage) {
             swiperInstance.on('zoomChange', onZoomChange);
         }
-        });
     }
 
     /**

src/elements/emby-itemscontainer/emby-itemscontainer.js

@@ -11,6 +11,7 @@ import serverNotifications from '../../scripts/serverNotifications';
 import { Events } from 'jellyfin-apiclient';
 import 'webcomponents.js/webcomponents-lite';
 import ServerConnections from '../../components/ServerConnections';
+import Sortable from 'sortablejs';
 
 /* eslint-disable indent */
 
@@ -133,7 +134,6 @@ import ServerConnections from '../../components/ServerConnections';
         }
 
         const self = this;
-        import('sortablejs').then((Sortable) => {
         self.sortable = new Sortable(self, {
             draggable: '.listItem',
             handle: '.listViewDragHandle',
@@ -143,7 +143,6 @@ import ServerConnections from '../../components/ServerConnections';
                 return onDrop(evt, self);
             }
         });
-        });
     };
 
     function onUserDataChanged(e, apiClient, userData) {

src/scripts/editorsidebar.js

@@ -183,7 +183,10 @@ import Dashboard from './clientUtils';
     }
 
     function initializeTree(page, currentUser, openItems, selectedId) {
-        import('jstree').then(() => {
+        Promise.all([
+            import('jstree'),
+            import('jstree/dist/themes/default/style.css')
+        ]).then(() => {
             initializeTreeInternal(page, currentUser, openItems, selectedId);
         });
     }