@garfish/loader - npm Package Compare versions

Comparing version 0.0.30 to 0.0.31

dist/appCache.d.ts

@@ -0,15 +1,20 @@
+export declare const cachedDataSet: WeakSet<object>;
+export declare enum FileTypes {
+    js = "js",
+    css = "css",
+    module = "module",
+    template = "template"
+}
 declare const DEFAULT_POLL: unique symbol;
-declare const FILE_TYPES: readonly ["js", "css", "template", "component"];
-export declare const cachedDataSet: WeakSet<object>;
-export declare type FileType = typeof FILE_TYPES[number];
 export declare class AppCacheContainer {
     private maxSize;
     private totalSize;
+    private recorder;
     constructor(maxSize?: number);
-    bufferPool(type: FileType | typeof DEFAULT_POLL): Map<string, any>;
+    bufferPool(type: FileTypes | typeof DEFAULT_POLL): Map<string, any>;
     has(url: string): boolean;
     get(url: string): any;
-    set(url: string, data: any, type: FileType): boolean;
-    clear(type?: FileType): void;
+    set(url: string, data: any, type: FileTypes): boolean;
+    clear(type?: FileTypes): void;
 }
 export {};

dist/index.d.ts

 import { PluginManager } from './pluginSystem';
-import { FileType } from './appCache';
+import { FileTypes } from './appCache';
 import { StyleManager } from './managers/style';
+import { ModuleManager } from './managers/module';
 import { TemplateManager } from './managers/template';
-import { ComponentManager } from './managers/component';
 import { JavaScriptManager } from './managers/javascript';
 export * from './managers/style';
+export * from './managers/module';
 export * from './managers/template';
-export * from './managers/component';
 export * from './managers/javascript';
-export declare type Manager = StyleManager | TemplateManager | ComponentManager | JavaScriptManager;
+export declare type Manager = StyleManager | ModuleManager | TemplateManager | JavaScriptManager;
 export interface LoaderOptions {
@@ -17,3 +17,3 @@ maxSize?: number;
     scope: string;
-    fileType?: FileType;
+    fileType?: FileTypes;
 }
@@ -25,3 +25,3 @@ export interface LoadedPluginArgs<T> {
         code: string;
-        fileType: FileType | '';
+        fileType: FileTypes | '';
         resourceManager: T | null;
@@ -39,2 +39,3 @@ };
     requestConfig: RequestInit | ((url: string) => RequestInit);
+    personalId: Symbol;
     lifecycle: {
@@ -49,11 +50,11 @@ clear: PluginManager<ClearPluginArgs>;
     constructor(options?: LoaderOptions);
-    clear(scope: string, fileType?: FileType): void;
-    clearAll(fileType?: FileType): void;
-    loadComponent<T extends Manager>(scope: string, url: string): Promise<{
+    clear(scope: string, fileType?: FileTypes): void;
+    clearAll(fileType?: FileTypes): void;
+    loadModule(url: string): Promise<{
         url: string;
         code: string;
-        fileType: "" | "js" | "css" | "template" | "component";
-        resourceManager: T;
+        fileType: "" | FileTypes;
+        resourceManager: ModuleManager;
     }>;
-    load<T extends Manager>(scope: string, url: string, isComponent?: boolean): Promise<LoadedPluginArgs<T>['value']>;
+    load<T extends Manager>(scope: string, url: string, isModule?: boolean): Promise<LoadedPluginArgs<T>['value']>;
 }

dist/loader.cjs.js

@@ -204,7 +204,7 @@ 'use strict';
     'link',
+    'style',
+    'script',
     'img',
-    'script',
     'video',
     'audio',
-    'style',
 ];
@@ -278,2 +278,22 @@ makeMap(sourceListTags);
     },
+    isRemoteModule(node) {
+        if (!this.isNode(node) || node.tagName !== 'meta')
+            return false;
+        let hasNameAttr, hasSrcAttr;
+        for (const { key, value } of node.attributes) {
+            if (key === 'name') {
+                hasNameAttr = true;
+                if (value !== 'garfish-remote-module') {
+                    return false;
+                }
+            }
+            else if (key === 'src') {
+                hasSrcAttr = true;
+                if (typeof value === 'undefined' || value === '') {
+                    return false;
+                }
+            }
+        }
+        return Boolean(hasNameAttr && hasSrcAttr);
+    },
     removeElement(el) {
@@ -537,14 +557,28 @@ const parentNode = el && el.parentNode;
 
+const cachedDataSet = new WeakSet();
+var FileTypes;
+(function (FileTypes) {
+    FileTypes["js"] = "js";
+    FileTypes["css"] = "css";
+    FileTypes["module"] = "module";
+    FileTypes["template"] = "template";
+})(FileTypes || (FileTypes = {}));
 const MAX_SIZE = 10 * 1024 * 1024;
 const DEFAULT_POLL = Symbol('__defaultBufferPoll__');
-const FILE_TYPES = ['js', 'css', 'template', 'component'];
-const cachedDataSet = new WeakSet();
+const FILE_TYPES = [
+    FileTypes.js,
+    FileTypes.css,
+    FileTypes.module,
+    FileTypes.template,
+    DEFAULT_POLL,
+];
 class AppCacheContainer {
     constructor(maxSize = MAX_SIZE) {
         this.totalSize = 0;
+        this.recorder = {};
         this.maxSize = maxSize;
         FILE_TYPES.forEach((key) => {
+            this.recorder[key] = 0;
             this[key] = new Map();
         });
-        this[DEFAULT_POLL] = new Map();
     }
@@ -555,4 +589,3 @@ bufferPool(type) {
     has(url) {
-        return (FILE_TYPES.some((key) => this[key].has(url)) ||
-            this.bufferPool(DEFAULT_POLL).has(url));
+        return FILE_TYPES.some((key) => this[key].has(url));
     }
@@ -565,15 +598,11 @@ get(url) {
         }
-        const defaultPool = this.bufferPool(DEFAULT_POLL);
-        if (defaultPool.has(url)) {
-            return defaultPool.get(url);
-        }
     }
     set(url, data, type) {
-        // prettier-ignore
-        const totalSize = this.totalSize + (cachedDataSet.has(data)
-            ? 0
-            : calculateObjectSize(data));
+        const curSize = cachedDataSet.has(data) ? 0 : calculateObjectSize(data);
+        const totalSize = this.totalSize + curSize;
         if (totalSize < this.maxSize) {
+            let bar = type;
             let bufferPool = this.bufferPool(type);
             if (!bufferPool) {
+                bar = DEFAULT_POLL;
                 bufferPool = this.bufferPool(DEFAULT_POLL);
@@ -583,2 +612,3 @@ }
             this.totalSize = totalSize;
+            this.recorder[bar] += curSize;
             return true;
@@ -592,2 +622,5 @@ }
             if (cacheBox && cacheBox instanceof Map) {
+                const size = this.recorder[type];
+                this.totalSize -= size;
+                this.recorder[type] = 0;
                 cacheBox.clear();
@@ -599,4 +632,5 @@ }
                 this[key].clear();
+                this.recorder[key] = 0;
             });
-            this.bufferPool(DEFAULT_POLL).clear();
+            this.totalSize = 0;
         }
@@ -655,7 +689,28 @@ }
 
+class ModuleManager {
+    constructor(moduleCode, url) {
+        this.alias = null;
+        this.url = url || null;
+        this.moduleCode = moduleCode;
+    }
+    setAlias(name) {
+        if (name && typeof name === 'string') {
+            this.alias = name;
+        }
+    }
+    clone() {
+        // @ts-ignore
+        const cloned = new this.constructor();
+        cloned.url = this.url;
+        cloned.alias = this.alias;
+        cloned.moduleCode = this.moduleCode;
+        return cloned;
+    }
+}
+
 // Convert irregular grammar to compliant grammar
 // 1M text takes about time:
-//   chrome 30ms
-//   safari: 25ms
-//   firefox: 25ms
+// 1. chrome 30ms
+// 2. safari: 25ms
+// 3. firefox: 25ms
 const transformCode = (code) => {
@@ -675,3 +730,3 @@ const node = document.createElement('html');
         // Pretreatment resource
-        this.getNodesByTagName('link', 'style', 'script');
+        this.getNodesByTagName('meta', 'link', 'style', 'script');
     }
@@ -750,2 +805,5 @@ getNodesByTagName(...tags) {
     }
+    findAllMetaNodes() {
+        return this.getNodesByTagName('meta').meta;
+    }
     findAllLinkNodes() {
@@ -775,16 +833,2 @@ return this.getNodesByTagName('link').link;
 
-class ComponentManager {
-    constructor(componentCode, url) {
-        this.url = url || null;
-        this.componentCode = componentCode;
-    }
-    clone() {
-        // @ts-ignore
-        const cloned = new this.constructor();
-        cloned.url = this.url;
-        cloned.componentCode = this.componentCode;
-        return cloned;
-    }
-}
-
 // Maybe we can convert "esModule" to "commonjs" in the future
@@ -840,2 +884,3 @@ class JavaScriptManager {
         this.cacheStore = Object.create(null);
+        this.personalId = Symbol.for('garfish.loader');
     }
@@ -854,7 +899,7 @@ clear(scope, fileType) {
     }
-    loadComponent(scope, url) {
-        return this.load(scope, url, true);
+    loadModule(url) {
+        return this.load('modules', url, true);
     }
     // Unable to know the final data type, so through "generics"
-    load(scope, url, isComponent = false) {
+    load(scope, url, isModule = false) {
         const { options, loadingList, cacheStore } = this;
@@ -875,9 +920,9 @@ if (loadingList[url]) {
                 const container = cacheStore[key];
-                if (container === appCacheContainer)
-                    continue;
-                if (container.has(url)) {
-                    const result = container.get(url);
-                    cachedDataSet.add(result);
-                    appCacheContainer.set(url, result, result.fileType);
-                    return Promise.resolve(copyResult(result));
+                if (container !== appCacheContainer) {
+                    if (container.has(url)) {
+                        const result = container.get(url);
+                        cachedDataSet.add(result);
+                        appCacheContainer.set(url, result, result.fileType);
+                        return Promise.resolve(copyResult(result));
+                    }
                 }
@@ -894,16 +939,16 @@ }
             let managerCtor, fileType;
-            if (isComponent) {
-                fileType = 'component';
-                managerCtor = ComponentManager;
+            if (isModule) {
+                fileType = FileTypes.module;
+                managerCtor = ModuleManager;
             }
             else if (isHtml(mimeType) || /\.html/.test(result.url)) {
-                fileType = 'template';
+                fileType = FileTypes.template;
                 managerCtor = TemplateManager;
             }
             else if (isJs(mimeType) || /\.js/.test(result.url)) {
-                fileType = 'js';
+                fileType = FileTypes.js;
                 managerCtor = JavaScriptManager;
             }
             else if (isCss(mimeType) || /\.css/.test(result.url)) {
-                fileType = 'css';
+                fileType = FileTypes.css;
                 managerCtor = StyleManager;
@@ -933,6 +978,6 @@ }
 
-exports.ComponentManager = ComponentManager;
 exports.JavaScriptManager = JavaScriptManager;
 exports.Loader = Loader;
+exports.ModuleManager = ModuleManager;
 exports.StyleManager = StyleManager;
 exports.TemplateManager = TemplateManager;

dist/loader.cjs.prod.js

@@ -204,7 +204,7 @@ 'use strict';
     'link',
+    'style',
+    'script',
     'img',
-    'script',
     'video',
     'audio',
-    'style',
 ];
@@ -278,2 +278,22 @@ makeMap(sourceListTags);
     },
+    isRemoteModule(node) {
+        if (!this.isNode(node) || node.tagName !== 'meta')
+            return false;
+        let hasNameAttr, hasSrcAttr;
+        for (const { key, value } of node.attributes) {
+            if (key === 'name') {
+                hasNameAttr = true;
+                if (value !== 'garfish-remote-module') {
+                    return false;
+                }
+            }
+            else if (key === 'src') {
+                hasSrcAttr = true;
+                if (typeof value === 'undefined' || value === '') {
+                    return false;
+                }
+            }
+        }
+        return Boolean(hasNameAttr && hasSrcAttr);
+    },
     removeElement(el) {
@@ -535,14 +555,28 @@ const parentNode = el && el.parentNode;
 
+const cachedDataSet = new WeakSet();
+var FileTypes;
+(function (FileTypes) {
+    FileTypes["js"] = "js";
+    FileTypes["css"] = "css";
+    FileTypes["module"] = "module";
+    FileTypes["template"] = "template";
+})(FileTypes || (FileTypes = {}));
 const MAX_SIZE = 10 * 1024 * 1024;
 const DEFAULT_POLL = Symbol('__defaultBufferPoll__');
-const FILE_TYPES = ['js', 'css', 'template', 'component'];
-const cachedDataSet = new WeakSet();
+const FILE_TYPES = [
+    FileTypes.js,
+    FileTypes.css,
+    FileTypes.module,
+    FileTypes.template,
+    DEFAULT_POLL,
+];
 class AppCacheContainer {
     constructor(maxSize = MAX_SIZE) {
         this.totalSize = 0;
+        this.recorder = {};
         this.maxSize = maxSize;
         FILE_TYPES.forEach((key) => {
+            this.recorder[key] = 0;
             this[key] = new Map();
         });
-        this[DEFAULT_POLL] = new Map();
     }
@@ -553,4 +587,3 @@ bufferPool(type) {
     has(url) {
-        return (FILE_TYPES.some((key) => this[key].has(url)) ||
-            this.bufferPool(DEFAULT_POLL).has(url));
+        return FILE_TYPES.some((key) => this[key].has(url));
     }
@@ -563,15 +596,11 @@ get(url) {
         }
-        const defaultPool = this.bufferPool(DEFAULT_POLL);
-        if (defaultPool.has(url)) {
-            return defaultPool.get(url);
-        }
     }
     set(url, data, type) {
-        // prettier-ignore
-        const totalSize = this.totalSize + (cachedDataSet.has(data)
-            ? 0
-            : calculateObjectSize(data));
+        const curSize = cachedDataSet.has(data) ? 0 : calculateObjectSize(data);
+        const totalSize = this.totalSize + curSize;
         if (totalSize < this.maxSize) {
+            let bar = type;
             let bufferPool = this.bufferPool(type);
             if (!bufferPool) {
+                bar = DEFAULT_POLL;
                 bufferPool = this.bufferPool(DEFAULT_POLL);
@@ -581,2 +610,3 @@ }
             this.totalSize = totalSize;
+            this.recorder[bar] += curSize;
             return true;
@@ -590,2 +620,5 @@ }
             if (cacheBox && cacheBox instanceof Map) {
+                const size = this.recorder[type];
+                this.totalSize -= size;
+                this.recorder[type] = 0;
                 cacheBox.clear();
@@ -597,4 +630,5 @@ }
                 this[key].clear();
+                this.recorder[key] = 0;
             });
-            this.bufferPool(DEFAULT_POLL).clear();
+            this.totalSize = 0;
         }
@@ -653,7 +687,28 @@ }
 
+class ModuleManager {
+    constructor(moduleCode, url) {
+        this.alias = null;
+        this.url = url || null;
+        this.moduleCode = moduleCode;
+    }
+    setAlias(name) {
+        if (name && typeof name === 'string') {
+            this.alias = name;
+        }
+    }
+    clone() {
+        // @ts-ignore
+        const cloned = new this.constructor();
+        cloned.url = this.url;
+        cloned.alias = this.alias;
+        cloned.moduleCode = this.moduleCode;
+        return cloned;
+    }
+}
+
 // Convert irregular grammar to compliant grammar
 // 1M text takes about time:
-//   chrome 30ms
-//   safari: 25ms
-//   firefox: 25ms
+// 1. chrome 30ms
+// 2. safari: 25ms
+// 3. firefox: 25ms
 const transformCode = (code) => {
@@ -673,3 +728,3 @@ const node = document.createElement('html');
         // Pretreatment resource
-        this.getNodesByTagName('link', 'style', 'script');
+        this.getNodesByTagName('meta', 'link', 'style', 'script');
     }
@@ -748,2 +803,5 @@ getNodesByTagName(...tags) {
     }
+    findAllMetaNodes() {
+        return this.getNodesByTagName('meta').meta;
+    }
     findAllLinkNodes() {
@@ -773,16 +831,2 @@ return this.getNodesByTagName('link').link;
 
-class ComponentManager {
-    constructor(componentCode, url) {
-        this.url = url || null;
-        this.componentCode = componentCode;
-    }
-    clone() {
-        // @ts-ignore
-        const cloned = new this.constructor();
-        cloned.url = this.url;
-        cloned.componentCode = this.componentCode;
-        return cloned;
-    }
-}
-
 // Maybe we can convert "esModule" to "commonjs" in the future
@@ -838,2 +882,3 @@ class JavaScriptManager {
         this.cacheStore = Object.create(null);
+        this.personalId = Symbol.for('garfish.loader');
     }
@@ -852,7 +897,7 @@ clear(scope, fileType) {
     }
-    loadComponent(scope, url) {
-        return this.load(scope, url, true);
+    loadModule(url) {
+        return this.load('modules', url, true);
     }
     // Unable to know the final data type, so through "generics"
-    load(scope, url, isComponent = false) {
+    load(scope, url, isModule = false) {
         const { options, loadingList, cacheStore } = this;
@@ -873,9 +918,9 @@ if (loadingList[url]) {
                 const container = cacheStore[key];
-                if (container === appCacheContainer)
-                    continue;
-                if (container.has(url)) {
-                    const result = container.get(url);
-                    cachedDataSet.add(result);
-                    appCacheContainer.set(url, result, result.fileType);
-                    return Promise.resolve(copyResult(result));
+                if (container !== appCacheContainer) {
+                    if (container.has(url)) {
+                        const result = container.get(url);
+                        cachedDataSet.add(result);
+                        appCacheContainer.set(url, result, result.fileType);
+                        return Promise.resolve(copyResult(result));
+                    }
                 }
@@ -892,16 +937,16 @@ }
             let managerCtor, fileType;
-            if (isComponent) {
-                fileType = 'component';
-                managerCtor = ComponentManager;
+            if (isModule) {
+                fileType = FileTypes.module;
+                managerCtor = ModuleManager;
             }
             else if (isHtml(mimeType) || /\.html/.test(result.url)) {
-                fileType = 'template';
+                fileType = FileTypes.template;
                 managerCtor = TemplateManager;
             }
             else if (isJs(mimeType) || /\.js/.test(result.url)) {
-                fileType = 'js';
+                fileType = FileTypes.js;
                 managerCtor = JavaScriptManager;
             }
             else if (isCss(mimeType) || /\.css/.test(result.url)) {
-                fileType = 'css';
+                fileType = FileTypes.css;
                 managerCtor = StyleManager;
@@ -931,6 +976,6 @@ }
 
-exports.ComponentManager = ComponentManager;
 exports.JavaScriptManager = JavaScriptManager;
 exports.Loader = Loader;
+exports.ModuleManager = ModuleManager;
 exports.StyleManager = StyleManager;
 exports.TemplateManager = TemplateManager;

dist/loader.esm-browser.js

@@ -198,7 +198,7 @@ /*! *****************************************************************************
     'link',
+    'style',
+    'script',
     'img',
-    'script',
     'video',
     'audio',
-    'style',
 ];
@@ -272,2 +272,22 @@ makeMap(sourceListTags);
     },
+    isRemoteModule(node) {
+        if (!this.isNode(node) || node.tagName !== 'meta')
+            return false;
+        let hasNameAttr, hasSrcAttr;
+        for (const { key, value } of node.attributes) {
+            if (key === 'name') {
+                hasNameAttr = true;
+                if (value !== 'garfish-remote-module') {
+                    return false;
+                }
+            }
+            else if (key === 'src') {
+                hasSrcAttr = true;
+                if (typeof value === 'undefined' || value === '') {
+                    return false;
+                }
+            }
+        }
+        return Boolean(hasNameAttr && hasSrcAttr);
+    },
     removeElement(el) {
@@ -531,14 +551,28 @@ const parentNode = el && el.parentNode;
 
+const cachedDataSet = new WeakSet();
+var FileTypes;
+(function (FileTypes) {
+    FileTypes["js"] = "js";
+    FileTypes["css"] = "css";
+    FileTypes["module"] = "module";
+    FileTypes["template"] = "template";
+})(FileTypes || (FileTypes = {}));
 const MAX_SIZE = 10 * 1024 * 1024;
 const DEFAULT_POLL = Symbol('__defaultBufferPoll__');
-const FILE_TYPES = ['js', 'css', 'template', 'component'];
-const cachedDataSet = new WeakSet();
+const FILE_TYPES = [
+    FileTypes.js,
+    FileTypes.css,
+    FileTypes.module,
+    FileTypes.template,
+    DEFAULT_POLL,
+];
 class AppCacheContainer {
     constructor(maxSize = MAX_SIZE) {
         this.totalSize = 0;
+        this.recorder = {};
         this.maxSize = maxSize;
         FILE_TYPES.forEach((key) => {
+            this.recorder[key] = 0;
             this[key] = new Map();
         });
-        this[DEFAULT_POLL] = new Map();
     }
@@ -549,4 +583,3 @@ bufferPool(type) {
     has(url) {
-        return (FILE_TYPES.some((key) => this[key].has(url)) ||
-            this.bufferPool(DEFAULT_POLL).has(url));
+        return FILE_TYPES.some((key) => this[key].has(url));
     }
@@ -559,15 +592,11 @@ get(url) {
         }
-        const defaultPool = this.bufferPool(DEFAULT_POLL);
-        if (defaultPool.has(url)) {
-            return defaultPool.get(url);
-        }
     }
     set(url, data, type) {
-        // prettier-ignore
-        const totalSize = this.totalSize + (cachedDataSet.has(data)
-            ? 0
-            : calculateObjectSize(data));
+        const curSize = cachedDataSet.has(data) ? 0 : calculateObjectSize(data);
+        const totalSize = this.totalSize + curSize;
         if (totalSize < this.maxSize) {
+            let bar = type;
             let bufferPool = this.bufferPool(type);
             if (!bufferPool) {
+                bar = DEFAULT_POLL;
                 bufferPool = this.bufferPool(DEFAULT_POLL);
@@ -577,2 +606,3 @@ }
             this.totalSize = totalSize;
+            this.recorder[bar] += curSize;
             return true;
@@ -586,2 +616,5 @@ }
             if (cacheBox && cacheBox instanceof Map) {
+                const size = this.recorder[type];
+                this.totalSize -= size;
+                this.recorder[type] = 0;
                 cacheBox.clear();
@@ -593,4 +626,5 @@ }
                 this[key].clear();
+                this.recorder[key] = 0;
             });
-            this.bufferPool(DEFAULT_POLL).clear();
+            this.totalSize = 0;
         }
@@ -649,2 +683,23 @@ }
 
+class ModuleManager {
+    constructor(moduleCode, url) {
+        this.alias = null;
+        this.url = url || null;
+        this.moduleCode = moduleCode;
+    }
+    setAlias(name) {
+        if (name && typeof name === 'string') {
+            this.alias = name;
+        }
+    }
+    clone() {
+        // @ts-ignore
+        const cloned = new this.constructor();
+        cloned.url = this.url;
+        cloned.alias = this.alias;
+        cloned.moduleCode = this.moduleCode;
+        return cloned;
+    }
+}
+
 function unwrapExports (x) {
@@ -1412,5 +1467,5 @@ return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
 // 1M text takes about time:
-//   chrome 30ms
-//   safari: 25ms
-//   firefox: 25ms
+// 1. chrome 30ms
+// 2. safari: 25ms
+// 3. firefox: 25ms
 const transformCode = (code) => {
@@ -1430,3 +1485,3 @@ const node = document.createElement('html');
         // Pretreatment resource
-        this.getNodesByTagName('link', 'style', 'script');
+        this.getNodesByTagName('meta', 'link', 'style', 'script');
     }
@@ -1505,2 +1560,5 @@ getNodesByTagName(...tags) {
     }
+    findAllMetaNodes() {
+        return this.getNodesByTagName('meta').meta;
+    }
     findAllLinkNodes() {
@@ -1530,16 +1588,2 @@ return this.getNodesByTagName('link').link;
 
-class ComponentManager {
-    constructor(componentCode, url) {
-        this.url = url || null;
-        this.componentCode = componentCode;
-    }
-    clone() {
-        // @ts-ignore
-        const cloned = new this.constructor();
-        cloned.url = this.url;
-        cloned.componentCode = this.componentCode;
-        return cloned;
-    }
-}
-
 // Maybe we can convert "esModule" to "commonjs" in the future
@@ -1595,2 +1639,3 @@ class JavaScriptManager {
         this.cacheStore = Object.create(null);
+        this.personalId = Symbol.for('garfish.loader');
     }
@@ -1609,7 +1654,7 @@ clear(scope, fileType) {
     }
-    loadComponent(scope, url) {
-        return this.load(scope, url, true);
+    loadModule(url) {
+        return this.load('modules', url, true);
     }
     // Unable to know the final data type, so through "generics"
-    load(scope, url, isComponent = false) {
+    load(scope, url, isModule = false) {
         const { options, loadingList, cacheStore } = this;
@@ -1630,9 +1675,9 @@ if (loadingList[url]) {
                 const container = cacheStore[key];
-                if (container === appCacheContainer)
-                    continue;
-                if (container.has(url)) {
-                    const result = container.get(url);
-                    cachedDataSet.add(result);
-                    appCacheContainer.set(url, result, result.fileType);
-                    return Promise.resolve(copyResult(result));
+                if (container !== appCacheContainer) {
+                    if (container.has(url)) {
+                        const result = container.get(url);
+                        cachedDataSet.add(result);
+                        appCacheContainer.set(url, result, result.fileType);
+                        return Promise.resolve(copyResult(result));
+                    }
                 }
@@ -1649,16 +1694,16 @@ }
             let managerCtor, fileType;
-            if (isComponent) {
-                fileType = 'component';
-                managerCtor = ComponentManager;
+            if (isModule) {
+                fileType = FileTypes.module;
+                managerCtor = ModuleManager;
             }
             else if (isHtml(mimeType) || /\.html/.test(result.url)) {
-                fileType = 'template';
+                fileType = FileTypes.template;
                 managerCtor = TemplateManager;
             }
             else if (isJs(mimeType) || /\.js/.test(result.url)) {
-                fileType = 'js';
+                fileType = FileTypes.js;
                 managerCtor = JavaScriptManager;
             }
             else if (isCss(mimeType) || /\.css/.test(result.url)) {
-                fileType = 'css';
+                fileType = FileTypes.css;
                 managerCtor = StyleManager;
@@ -1688,2 +1733,2 @@ }
 
-export { ComponentManager, JavaScriptManager, Loader, StyleManager, TemplateManager };
+export { JavaScriptManager, Loader, ModuleManager, StyleManager, TemplateManager };

dist/loader.esm-bundler.js

@@ -200,7 +200,7 @@ import { parse } from 'himalaya';
     'link',
+    'style',
+    'script',
     'img',
-    'script',
     'video',
     'audio',
-    'style',
 ];
@@ -274,2 +274,22 @@ makeMap(sourceListTags);
     },
+    isRemoteModule(node) {
+        if (!this.isNode(node) || node.tagName !== 'meta')
+            return false;
+        let hasNameAttr, hasSrcAttr;
+        for (const { key, value } of node.attributes) {
+            if (key === 'name') {
+                hasNameAttr = true;
+                if (value !== 'garfish-remote-module') {
+                    return false;
+                }
+            }
+            else if (key === 'src') {
+                hasSrcAttr = true;
+                if (typeof value === 'undefined' || value === '') {
+                    return false;
+                }
+            }
+        }
+        return Boolean(hasNameAttr && hasSrcAttr);
+    },
     removeElement(el) {
@@ -533,14 +553,28 @@ const parentNode = el && el.parentNode;
 
+const cachedDataSet = new WeakSet();
+var FileTypes;
+(function (FileTypes) {
+    FileTypes["js"] = "js";
+    FileTypes["css"] = "css";
+    FileTypes["module"] = "module";
+    FileTypes["template"] = "template";
+})(FileTypes || (FileTypes = {}));
 const MAX_SIZE = 10 * 1024 * 1024;
 const DEFAULT_POLL = Symbol('__defaultBufferPoll__');
-const FILE_TYPES = ['js', 'css', 'template', 'component'];
-const cachedDataSet = new WeakSet();
+const FILE_TYPES = [
+    FileTypes.js,
+    FileTypes.css,
+    FileTypes.module,
+    FileTypes.template,
+    DEFAULT_POLL,
+];
 class AppCacheContainer {
     constructor(maxSize = MAX_SIZE) {
         this.totalSize = 0;
+        this.recorder = {};
         this.maxSize = maxSize;
         FILE_TYPES.forEach((key) => {
+            this.recorder[key] = 0;
             this[key] = new Map();
         });
-        this[DEFAULT_POLL] = new Map();
     }
@@ -551,4 +585,3 @@ bufferPool(type) {
     has(url) {
-        return (FILE_TYPES.some((key) => this[key].has(url)) ||
-            this.bufferPool(DEFAULT_POLL).has(url));
+        return FILE_TYPES.some((key) => this[key].has(url));
     }
@@ -561,15 +594,11 @@ get(url) {
         }
-        const defaultPool = this.bufferPool(DEFAULT_POLL);
-        if (defaultPool.has(url)) {
-            return defaultPool.get(url);
-        }
     }
     set(url, data, type) {
-        // prettier-ignore
-        const totalSize = this.totalSize + (cachedDataSet.has(data)
-            ? 0
-            : calculateObjectSize(data));
+        const curSize = cachedDataSet.has(data) ? 0 : calculateObjectSize(data);
+        const totalSize = this.totalSize + curSize;
         if (totalSize < this.maxSize) {
+            let bar = type;
             let bufferPool = this.bufferPool(type);
             if (!bufferPool) {
+                bar = DEFAULT_POLL;
                 bufferPool = this.bufferPool(DEFAULT_POLL);
@@ -579,2 +608,3 @@ }
             this.totalSize = totalSize;
+            this.recorder[bar] += curSize;
             return true;
@@ -588,2 +618,5 @@ }
             if (cacheBox && cacheBox instanceof Map) {
+                const size = this.recorder[type];
+                this.totalSize -= size;
+                this.recorder[type] = 0;
                 cacheBox.clear();
@@ -595,4 +628,5 @@ }
                 this[key].clear();
+                this.recorder[key] = 0;
             });
-            this.bufferPool(DEFAULT_POLL).clear();
+            this.totalSize = 0;
         }
@@ -651,7 +685,28 @@ }
 
+class ModuleManager {
+    constructor(moduleCode, url) {
+        this.alias = null;
+        this.url = url || null;
+        this.moduleCode = moduleCode;
+    }
+    setAlias(name) {
+        if (name && typeof name === 'string') {
+            this.alias = name;
+        }
+    }
+    clone() {
+        // @ts-ignore
+        const cloned = new this.constructor();
+        cloned.url = this.url;
+        cloned.alias = this.alias;
+        cloned.moduleCode = this.moduleCode;
+        return cloned;
+    }
+}
+
 // Convert irregular grammar to compliant grammar
 // 1M text takes about time:
-//   chrome 30ms
-//   safari: 25ms
-//   firefox: 25ms
+// 1. chrome 30ms
+// 2. safari: 25ms
+// 3. firefox: 25ms
 const transformCode = (code) => {
@@ -671,3 +726,3 @@ const node = document.createElement('html');
         // Pretreatment resource
-        this.getNodesByTagName('link', 'style', 'script');
+        this.getNodesByTagName('meta', 'link', 'style', 'script');
     }
@@ -746,2 +801,5 @@ getNodesByTagName(...tags) {
     }
+    findAllMetaNodes() {
+        return this.getNodesByTagName('meta').meta;
+    }
     findAllLinkNodes() {
@@ -771,16 +829,2 @@ return this.getNodesByTagName('link').link;
 
-class ComponentManager {
-    constructor(componentCode, url) {
-        this.url = url || null;
-        this.componentCode = componentCode;
-    }
-    clone() {
-        // @ts-ignore
-        const cloned = new this.constructor();
-        cloned.url = this.url;
-        cloned.componentCode = this.componentCode;
-        return cloned;
-    }
-}
-
 // Maybe we can convert "esModule" to "commonjs" in the future
@@ -836,2 +880,3 @@ class JavaScriptManager {
         this.cacheStore = Object.create(null);
+        this.personalId = Symbol.for('garfish.loader');
     }
@@ -850,7 +895,7 @@ clear(scope, fileType) {
     }
-    loadComponent(scope, url) {
-        return this.load(scope, url, true);
+    loadModule(url) {
+        return this.load('modules', url, true);
     }
     // Unable to know the final data type, so through "generics"
-    load(scope, url, isComponent = false) {
+    load(scope, url, isModule = false) {
         const { options, loadingList, cacheStore } = this;
@@ -871,9 +916,9 @@ if (loadingList[url]) {
                 const container = cacheStore[key];
-                if (container === appCacheContainer)
-                    continue;
-                if (container.has(url)) {
-                    const result = container.get(url);
-                    cachedDataSet.add(result);
-                    appCacheContainer.set(url, result, result.fileType);
-                    return Promise.resolve(copyResult(result));
+                if (container !== appCacheContainer) {
+                    if (container.has(url)) {
+                        const result = container.get(url);
+                        cachedDataSet.add(result);
+                        appCacheContainer.set(url, result, result.fileType);
+                        return Promise.resolve(copyResult(result));
+                    }
                 }
@@ -890,16 +935,16 @@ }
             let managerCtor, fileType;
-            if (isComponent) {
-                fileType = 'component';
-                managerCtor = ComponentManager;
+            if (isModule) {
+                fileType = FileTypes.module;
+                managerCtor = ModuleManager;
             }
             else if (isHtml(mimeType) || /\.html/.test(result.url)) {
-                fileType = 'template';
+                fileType = FileTypes.template;
                 managerCtor = TemplateManager;
             }
             else if (isJs(mimeType) || /\.js/.test(result.url)) {
-                fileType = 'js';
+                fileType = FileTypes.js;
                 managerCtor = JavaScriptManager;
             }
             else if (isCss(mimeType) || /\.css/.test(result.url)) {
-                fileType = 'css';
+                fileType = FileTypes.css;
                 managerCtor = StyleManager;
@@ -929,2 +974,2 @@ }
 
-export { ComponentManager, JavaScriptManager, Loader, StyleManager, TemplateManager };
+export { JavaScriptManager, Loader, ModuleManager, StyleManager, TemplateManager };

dist/loader.umd.js

@@ -204,7 +204,7 @@ (function (global, factory) {
         'link',
+        'style',
+        'script',
         'img',
-        'script',
         'video',
         'audio',
-        'style',
     ];
@@ -278,2 +278,22 @@ makeMap(sourceListTags);
         },
+        isRemoteModule(node) {
+            if (!this.isNode(node) || node.tagName !== 'meta')
+                return false;
+            let hasNameAttr, hasSrcAttr;
+            for (const { key, value } of node.attributes) {
+                if (key === 'name') {
+                    hasNameAttr = true;
+                    if (value !== 'garfish-remote-module') {
+                        return false;
+                    }
+                }
+                else if (key === 'src') {
+                    hasSrcAttr = true;
+                    if (typeof value === 'undefined' || value === '') {
+                        return false;
+                    }
+                }
+            }
+            return Boolean(hasNameAttr && hasSrcAttr);
+        },
         removeElement(el) {
@@ -537,14 +557,28 @@ const parentNode = el && el.parentNode;
 
+    const cachedDataSet = new WeakSet();
+    var FileTypes;
+    (function (FileTypes) {
+        FileTypes["js"] = "js";
+        FileTypes["css"] = "css";
+        FileTypes["module"] = "module";
+        FileTypes["template"] = "template";
+    })(FileTypes || (FileTypes = {}));
     const MAX_SIZE = 10 * 1024 * 1024;
     const DEFAULT_POLL = Symbol('__defaultBufferPoll__');
-    const FILE_TYPES = ['js', 'css', 'template', 'component'];
-    const cachedDataSet = new WeakSet();
+    const FILE_TYPES = [
+        FileTypes.js,
+        FileTypes.css,
+        FileTypes.module,
+        FileTypes.template,
+        DEFAULT_POLL,
+    ];
     class AppCacheContainer {
         constructor(maxSize = MAX_SIZE) {
             this.totalSize = 0;
+            this.recorder = {};
             this.maxSize = maxSize;
             FILE_TYPES.forEach((key) => {
+                this.recorder[key] = 0;
                 this[key] = new Map();
             });
-            this[DEFAULT_POLL] = new Map();
         }
@@ -555,4 +589,3 @@ bufferPool(type) {
         has(url) {
-            return (FILE_TYPES.some((key) => this[key].has(url)) ||
-                this.bufferPool(DEFAULT_POLL).has(url));
+            return FILE_TYPES.some((key) => this[key].has(url));
         }
@@ -565,15 +598,11 @@ get(url) {
             }
-            const defaultPool = this.bufferPool(DEFAULT_POLL);
-            if (defaultPool.has(url)) {
-                return defaultPool.get(url);
-            }
         }
         set(url, data, type) {
-            // prettier-ignore
-            const totalSize = this.totalSize + (cachedDataSet.has(data)
-                ? 0
-                : calculateObjectSize(data));
+            const curSize = cachedDataSet.has(data) ? 0 : calculateObjectSize(data);
+            const totalSize = this.totalSize + curSize;
             if (totalSize < this.maxSize) {
+                let bar = type;
                 let bufferPool = this.bufferPool(type);
                 if (!bufferPool) {
+                    bar = DEFAULT_POLL;
                     bufferPool = this.bufferPool(DEFAULT_POLL);
@@ -583,2 +612,3 @@ }
                 this.totalSize = totalSize;
+                this.recorder[bar] += curSize;
                 return true;
@@ -592,2 +622,5 @@ }
                 if (cacheBox && cacheBox instanceof Map) {
+                    const size = this.recorder[type];
+                    this.totalSize -= size;
+                    this.recorder[type] = 0;
                     cacheBox.clear();
@@ -599,4 +632,5 @@ }
                     this[key].clear();
+                    this.recorder[key] = 0;
                 });
-                this.bufferPool(DEFAULT_POLL).clear();
+                this.totalSize = 0;
             }
@@ -655,2 +689,23 @@ }
 
+    class ModuleManager {
+        constructor(moduleCode, url) {
+            this.alias = null;
+            this.url = url || null;
+            this.moduleCode = moduleCode;
+        }
+        setAlias(name) {
+            if (name && typeof name === 'string') {
+                this.alias = name;
+            }
+        }
+        clone() {
+            // @ts-ignore
+            const cloned = new this.constructor();
+            cloned.url = this.url;
+            cloned.alias = this.alias;
+            cloned.moduleCode = this.moduleCode;
+            return cloned;
+        }
+    }
+
     function unwrapExports (x) {
@@ -1418,5 +1473,5 @@ return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
     // 1M text takes about time:
-    //   chrome 30ms
-    //   safari: 25ms
-    //   firefox: 25ms
+    // 1. chrome 30ms
+    // 2. safari: 25ms
+    // 3. firefox: 25ms
     const transformCode = (code) => {
@@ -1436,3 +1491,3 @@ const node = document.createElement('html');
             // Pretreatment resource
-            this.getNodesByTagName('link', 'style', 'script');
+            this.getNodesByTagName('meta', 'link', 'style', 'script');
         }
@@ -1511,2 +1566,5 @@ getNodesByTagName(...tags) {
         }
+        findAllMetaNodes() {
+            return this.getNodesByTagName('meta').meta;
+        }
         findAllLinkNodes() {
@@ -1536,16 +1594,2 @@ return this.getNodesByTagName('link').link;
 
-    class ComponentManager {
-        constructor(componentCode, url) {
-            this.url = url || null;
-            this.componentCode = componentCode;
-        }
-        clone() {
-            // @ts-ignore
-            const cloned = new this.constructor();
-            cloned.url = this.url;
-            cloned.componentCode = this.componentCode;
-            return cloned;
-        }
-    }
-
     // Maybe we can convert "esModule" to "commonjs" in the future
@@ -1601,2 +1645,3 @@ class JavaScriptManager {
             this.cacheStore = Object.create(null);
+            this.personalId = Symbol.for('garfish.loader');
         }
@@ -1615,7 +1660,7 @@ clear(scope, fileType) {
         }
-        loadComponent(scope, url) {
-            return this.load(scope, url, true);
+        loadModule(url) {
+            return this.load('modules', url, true);
         }
         // Unable to know the final data type, so through "generics"
-        load(scope, url, isComponent = false) {
+        load(scope, url, isModule = false) {
             const { options, loadingList, cacheStore } = this;
@@ -1636,9 +1681,9 @@ if (loadingList[url]) {
                     const container = cacheStore[key];
-                    if (container === appCacheContainer)
-                        continue;
-                    if (container.has(url)) {
-                        const result = container.get(url);
-                        cachedDataSet.add(result);
-                        appCacheContainer.set(url, result, result.fileType);
-                        return Promise.resolve(copyResult(result));
+                    if (container !== appCacheContainer) {
+                        if (container.has(url)) {
+                            const result = container.get(url);
+                            cachedDataSet.add(result);
+                            appCacheContainer.set(url, result, result.fileType);
+                            return Promise.resolve(copyResult(result));
+                        }
                     }
@@ -1655,16 +1700,16 @@ }
                 let managerCtor, fileType;
-                if (isComponent) {
-                    fileType = 'component';
-                    managerCtor = ComponentManager;
+                if (isModule) {
+                    fileType = FileTypes.module;
+                    managerCtor = ModuleManager;
                 }
                 else if (isHtml(mimeType) || /\.html/.test(result.url)) {
-                    fileType = 'template';
+                    fileType = FileTypes.template;
                     managerCtor = TemplateManager;
                 }
                 else if (isJs(mimeType) || /\.js/.test(result.url)) {
-                    fileType = 'js';
+                    fileType = FileTypes.js;
                     managerCtor = JavaScriptManager;
                 }
                 else if (isCss(mimeType) || /\.css/.test(result.url)) {
-                    fileType = 'css';
+                    fileType = FileTypes.css;
                     managerCtor = StyleManager;
@@ -1694,5 +1739,5 @@ }
 
-    exports.ComponentManager = ComponentManager;
     exports.JavaScriptManager = JavaScriptManager;
     exports.Loader = Loader;
+    exports.ModuleManager = ModuleManager;
     exports.StyleManager = StyleManager;
@@ -1699,0 +1744,0 @@ exports.TemplateManager = TemplateManager;

dist/managers/template.d.ts

@@ -11,2 +11,3 @@ import { Node, Text } from '@garfish/utils';
         isPrefetchJsLinkNode(node: Node): boolean;
+        isRemoteModule(node: Node): boolean;
         removeElement(el: Element): void;
@@ -30,2 +31,3 @@ createElement(node: Node): HTMLElement | SVGElement;
     toResolveUrl(node: Node, type: string, baseUrl: string): void;
+    findAllMetaNodes(): Node[];
     findAllLinkNodes(): Node[];
@@ -32,0 +34,0 @@ findAllJsNodes(): Node[];

dist/utils.d.ts

@@ -13,3 +13,3 @@ import { Loader, LoadedPluginArgs } from './index';
     code: string;
-    fileType: "" | "js" | "css" | "template" | "component";
+    fileType: "" | import("./appCache").FileTypes;
     resourceManager: any;
@@ -16,0 +16,0 @@ };

package.json

 {
   "name": "@garfish/loader",
-  "version": "0.0.30",
+  "version": "0.0.31",
   "description": "loader module.",
@@ -34,3 +34,2 @@ "keywords": [
   "dependencies": {
-    "@garfish/utils": "^0.0.30",
     "himalaya": "1.1.0"
@@ -42,3 +41,3 @@ },
   },
-  "gitHead": "ff9e4aceb22b2a1de4bdf2de8e9bb96998c1dabd"
+  "gitHead": "4a882c7f2734d085689d423f5e0c51d9a0eccbba"
 }

README.md

 # `@garfish/loader`
 
-> TODO: Garfish loader
-
 ## Usage
@@ -6,0 +4,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

229339

increased by3.22%

Dependency count

1

decreased by-50%

Lines of code

6191

increased by3.95%

Worsened metrics

Number of lines in readme file

51

decreased by-3.77%

Dependency changes

• - Removed@garfish/utils@^0.0.30

• - Removed@garfish/utils@0.0.30(transitive)