Skip to content

Commit 19ab049

Browse files
committed
feat: add code
1 parent e11f4ad commit 19ab049

File tree

8 files changed

+50
-31
lines changed

8 files changed

+50
-31
lines changed

dev/app-main/public/index.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,8 @@
3232
</style>
3333
</head>
3434
<body>
35+
<!-- <script src="https://cdn.jsdelivr.net/npm/hash-wasm@4/dist/md5.umd.min.js"></script> -->
36+
<script src="https://cdn.jsdelivr.net/npm/hash-wasm@4"></script>
3537
<div id="root"></div>
3638
</body>
3739
</html>

packages/css-scope/package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@
3535
"access": "public"
3636
},
3737
"dependencies": {
38-
"@garfish/utils": "workspace:*"
38+
"@garfish/utils": "workspace:*",
39+
"spark-md5": "3.0.2"
3940
}
4041
}

packages/css-scope/src/index.ts

Lines changed: 36 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import SparkMD5 from 'spark-md5';
12
import { warn } from '@garfish/utils';
23
import type { interfaces } from '@garfish/core';
34
import type { Loader, StyleManager } from '@garfish/loader';
@@ -9,13 +10,14 @@ export interface Options {
910
excludes?: Array<string> | ((name: string) => boolean);
1011
}
1112

13+
const pluginName = 'css-scope';
14+
const idleCallback = window.requestIdleCallback || window.requestAnimationFrame;
15+
1216
export function GarfishCssScope(options: Options = {}) {
13-
const pluginName = 'css-scope';
17+
const spark = new SparkMD5();
1418
const protoCache = new Set<StyleManager>();
1519
const codeCache = new Map<string, string>();
16-
const astCache = new Map<number, StylesheetNode>();
17-
const idleCallback =
18-
window.requestIdleCallback || window.requestAnimationFrame;
20+
const astCache = new Map<string, StylesheetNode>();
1921

2022
const disable = (appName: string) => {
2123
const { excludes } = options;
@@ -31,11 +33,11 @@ export function GarfishCssScope(options: Options = {}) {
3133

3234
loaded({ value, result }) {
3335
if (value.url && value.fileType === 'css' && !disable(value.scope)) {
34-
const { id, styleCode } = value.resourceManager as StyleManager;
36+
const { styleCode } = value.resourceManager as StyleManager;
3537
idleCallback(() => {
36-
if (!astCache.has(id)) {
38+
if (!astCache.has(value.url)) {
3739
const astNode = parse(styleCode, { source: value.url });
38-
astCache.set(id, astNode);
40+
astCache.set(value.url, astNode);
3941
}
4042
});
4143
}
@@ -44,6 +46,7 @@ export function GarfishCssScope(options: Options = {}) {
4446
});
4547
};
4648

49+
let id = 0;
4750
return function (Garfish: interfaces.Garfish): interfaces.Plugin {
4851
return {
4952
name: pluginName,
@@ -66,17 +69,37 @@ export function GarfishCssScope(options: Options = {}) {
6669
return originTransform.call(this, code);
6770
}
6871

69-
let astNode = astCache.get(this.id);
70-
if (!astNode) {
71-
astNode = parse(code, { source: this.url });
72-
astCache.set(this.id, astNode);
72+
let newCode;
73+
console.time('tt' + ++id);
74+
const hash = spark.append(code).end();
75+
console.timeEnd('tt' + id);
76+
console.log(hash, 1);
77+
78+
(async () => {
79+
const i = id;
80+
await (window as any).hashwasm.md5('code');
81+
console.time('ttt' + i);
82+
const hash = await (window as any).hashwasm.md5(code, 100);
83+
console.timeEnd('ttt' + i);
84+
console.log(hash, 2);
85+
})();
86+
87+
if (codeCache.has(hash)) {
88+
newCode = codeCache.get(hash);
89+
} else {
90+
let astNode = astCache.get(this.url);
91+
if (!astNode) {
92+
astNode = parse(code, { source: this.url });
93+
}
94+
newCode = stringify(astNode, `#${rootElId}`);
95+
codeCache.set(hash, newCode);
7396
}
74-
const newCode = stringify(astNode, `#${rootElId}`);
97+
console.timeEnd(appName);
7598
return originTransform.call(this, newCode);
7699
};
77100
},
78101

79-
beforeLoad(appInfo) {
102+
async beforeLoad(appInfo) {
80103
if (__DEV__) {
81104
const { name, sandbox } = appInfo;
82105
if (!disable(name)) {

packages/loader/src/managers/javascript.ts

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,6 @@
11
import { Node } from '@garfish/utils';
22

3-
let id = 0;
4-
53
export class JavaScriptManager {
6-
public id = id++;
74
public async: boolean;
85
public mimeType: string;
96
public scriptCode: string;
@@ -46,7 +43,6 @@ export class JavaScriptManager {
4643
clone() {
4744
// @ts-ignore
4845
const cloned = new this.constructor();
49-
cloned.id = this.id;
5046
cloned.url = this.url;
5147
cloned.async = this.async;
5248
cloned.mimeType = this.mimeType;

packages/loader/src/managers/module.ts

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,4 @@
1-
let id = 0;
2-
31
export class ModuleManager {
4-
public id = id++;
52
public moduleCode: string;
63
public url: string | null;
74
public originUrl?: string;
@@ -22,7 +19,6 @@ export class ModuleManager {
2219
clone() {
2320
// @ts-ignore
2421
const cloned = new this.constructor();
25-
cloned.id = this.id;
2622
cloned.url = this.url;
2723
cloned.alias = this.alias;
2824
cloned.moduleCode = this.moduleCode;

packages/loader/src/managers/style.ts

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
import { Node, isAbsolute, transformUrl } from '@garfish/utils';
22

3-
let id = 0;
4-
53
// Match url in css
64
const MATCH_CSS_URL = /url\(['"]?([^\)]+?)['"]?\)/g;
75

@@ -11,7 +9,6 @@ interface ScopeData {
119
}
1210

1311
export class StyleManager {
14-
public id = id++;
1512
public styleCode: string;
1613
public url: string | null;
1714
public scopeData: ScopeData | null;
@@ -69,7 +66,6 @@ export class StyleManager {
6966
clone() {
7067
// @ts-ignore
7168
const cloned = new this.constructor();
72-
cloned.id = this.id;
7369
cloned.url = this.url;
7470
cloned.styleCode = this.styleCode;
7571
cloned.scopeData = this.scopeData;

packages/loader/src/managers/template.ts

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,7 @@ import {
99

1010
type Renderer = Record<string, (node: Node) => Element | Comment>;
1111

12-
let id = 0;
13-
1412
export class TemplateManager {
15-
public id = id++;
1613
public url: string | null;
1714
public DOMApis = new DOMApis();
1815
public astTree: Array<Node> = [];
@@ -140,7 +137,6 @@ export class TemplateManager {
140137
clone() {
141138
// @ts-ignore
142139
const cloned = new this.constructor();
143-
cloned.id = this.id;
144140
cloned.url = this.url;
145141
cloned.astTree = this.astTree;
146142
cloned.pretreatmentStore = this.pretreatmentStore;

pnpm-lock.yaml

Lines changed: 10 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)