Skip to content

Commit 50b7b9b

Browse files
seiyabseiyab
committed
refactor code, reduce bundle size
1 parent ee85e7a commit 50b7b9b

File tree

16 files changed

+92
-154
lines changed

16 files changed

+92
-154
lines changed

‎packages/css-jss/.size-snapshot.json

+6-6
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
{
22
"css-jss.js": {
3-
"bundled": 60515,
4-
"minified": 22102,
5-
"gzipped": 7440
3+
"bundled": 60211,
4+
"minified": 21999,
5+
"gzipped": 7410
66
},
77
"css-jss.min.js": {
8-
"bundled": 59440,
9-
"minified": 21479,
10-
"gzipped": 7161
8+
"bundled": 59136,
9+
"minified": 21376,
10+
"gzipped": 7125
1111
},
1212
"css-jss.cjs.js": {
1313
"bundled": 2949,

‎packages/jss-plugin-global/.size-snapshot.json

+12-12
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,23 @@
11
{
22
"jss-plugin-global.js": {
3-
"bundled": 5690,
4-
"minified": 2423,
5-
"gzipped": 986
3+
"bundled": 5385,
4+
"minified": 2319,
5+
"gzipped": 955
66
},
77
"jss-plugin-global.min.js": {
8-
"bundled": 5690,
9-
"minified": 2423,
10-
"gzipped": 986
8+
"bundled": 5385,
9+
"minified": 2319,
10+
"gzipped": 955
1111
},
1212
"jss-plugin-global.cjs.js": {
13-
"bundled": 4925,
14-
"minified": 2549,
15-
"gzipped": 958
13+
"bundled": 4638,
14+
"minified": 2445,
15+
"gzipped": 926
1616
},
1717
"jss-plugin-global.esm.js": {
18-
"bundled": 4579,
19-
"minified": 2275,
20-
"gzipped": 857,
18+
"bundled": 4292,
19+
"minified": 2171,
20+
"gzipped": 822,
2121
"treeshaked": {
2222
"rollup": {
2323
"code": 55,

‎packages/jss-plugin-global/src/index.js

-9
Original file line numberDiff line numberDiff line change
@@ -50,15 +50,6 @@ class GlobalContainerRule {
5050
return [oldRule, newRule]
5151
}
5252

53-
/**
54-
* replaceRule if rule with same name exists.
55-
* Or else, addRule
56-
*/
57-
upsertRule(name, style, options) {
58-
if (this.getRule(name)) return this.replaceRule(name, style, options)
59-
return [null, this.addRule(name, style, options)]
60-
}
61-
6253
/**
6354
* Get index of a rule.
6455
*/

‎packages/jss-plugin-nested/.size-snapshot.json

+12-12
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,23 @@
11
{
22
"jss-plugin-nested.js": {
3-
"bundled": 4581,
4-
"minified": 1653,
5-
"gzipped": 903
3+
"bundled": 4582,
4+
"minified": 1654,
5+
"gzipped": 900
66
},
77
"jss-plugin-nested.min.js": {
8-
"bundled": 4141,
9-
"minified": 1437,
10-
"gzipped": 775
8+
"bundled": 4142,
9+
"minified": 1438,
10+
"gzipped": 772
1111
},
1212
"jss-plugin-nested.cjs.js": {
13-
"bundled": 3846,
14-
"minified": 1613,
15-
"gzipped": 831
13+
"bundled": 3847,
14+
"minified": 1614,
15+
"gzipped": 828
1616
},
1717
"jss-plugin-nested.esm.js": {
18-
"bundled": 3427,
19-
"minified": 1290,
20-
"gzipped": 713,
18+
"bundled": 3428,
19+
"minified": 1291,
20+
"gzipped": 712,
2121
"treeshaked": {
2222
"rollup": {
2323
"code": 64,

‎packages/jss-plugin-nested/src/index.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,7 @@ export default function jssNested() {
9191
if (name === styleRule.key) {
9292
name = `${styleRule.key}-&`
9393
}
94-
container.upsertRule(name, style[prop], {...options, selector})
94+
container.replaceRule(name, style[prop], {...options, selector})
9595
} else if (isNestedConditional) {
9696
// Place conditional right after the parent rule to ensure right ordering.
9797
container

‎packages/jss-preset-default/.size-snapshot.json

+6-6
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
{
22
"jss-preset-default.js": {
3-
"bundled": 57802,
4-
"minified": 21326,
5-
"gzipped": 7091
3+
"bundled": 57498,
4+
"minified": 21223,
5+
"gzipped": 7061
66
},
77
"jss-preset-default.min.js": {
8-
"bundled": 56727,
9-
"minified": 20703,
10-
"gzipped": 6809
8+
"bundled": 56423,
9+
"minified": 20600,
10+
"gzipped": 6779
1111
},
1212
"jss-preset-default.cjs.js": {
1313
"bundled": 2222,

‎packages/jss-starter-kit/.size-snapshot.json

+6-6
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
{
22
"jss-starter-kit.js": {
3-
"bundled": 73830,
4-
"minified": 31777,
5-
"gzipped": 9724
3+
"bundled": 73526,
4+
"minified": 31674,
5+
"gzipped": 9694
66
},
77
"jss-starter-kit.min.js": {
8-
"bundled": 72755,
9-
"minified": 31589,
10-
"gzipped": 9500
8+
"bundled": 72451,
9+
"minified": 31486,
10+
"gzipped": 9469
1111
},
1212
"jss-starter-kit.cjs.js": {
1313
"bundled": 5647,

‎packages/jss/.size-snapshot.json

+14-14
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,30 @@
11
{
22
"jss.js": {
3-
"bundled": 67097,
4-
"minified": 23923,
5-
"gzipped": 7315
3+
"bundled": 65493,
4+
"minified": 23424,
5+
"gzipped": 7254
66
},
77
"jss.min.js": {
8-
"bundled": 65701,
9-
"minified": 23154,
10-
"gzipped": 6967
8+
"bundled": 64097,
9+
"minified": 22655,
10+
"gzipped": 6911
1111
},
1212
"jss.cjs.js": {
13-
"bundled": 62645,
14-
"minified": 26960,
15-
"gzipped": 7438
13+
"bundled": 61131,
14+
"minified": 26452,
15+
"gzipped": 7370
1616
},
1717
"jss.esm.js": {
18-
"bundled": 61017,
19-
"minified": 25654,
20-
"gzipped": 7266,
18+
"bundled": 59503,
19+
"minified": 25146,
20+
"gzipped": 7198,
2121
"treeshaked": {
2222
"rollup": {
23-
"code": 20909,
23+
"code": 20410,
2424
"import_statements": 345
2525
},
2626
"webpack": {
27-
"code": 22399
27+
"code": 21900
2828
}
2929
}
3030
}

‎packages/jss/src/RuleList.js

+6-35
Original file line numberDiff line numberDiff line change
@@ -87,50 +87,21 @@ export default class RuleList {
8787

8888
/**
8989
* Replace rule.
90-
*
9190
* Return [oldRule, newRule]
92-
*
93-
* Nothing happens if old rule doesn't exist.
94-
*
9591
* Create a new rule and remove old one instead of overwriting
9692
* because we want to invoke onCreateRule hook to make plugins work.
9793
*/
9894
replace(name, decl, ruleOptions) {
99-
const {parent, sheet, jss, Renderer, generateId, scoped} = this.options
100-
const options = {
101-
classes: this.classes,
102-
parent,
103-
sheet,
104-
jss,
105-
Renderer,
106-
generateId,
107-
scoped,
108-
name,
109-
keyframes: this.keyframes,
110-
selector: undefined,
111-
...ruleOptions
112-
}
113-
11495
const oldRule = this.getByName(name)
11596
const oldIndex = this.index.indexOf(oldRule)
116-
if (!oldRule || oldIndex === -1) {
117-
return [null, null]
97+
if (oldRule) {
98+
this.remove(oldRule)
11899
}
119-
120-
// We need to save the original decl before creating the rule
121-
// because cache plugin needs to use it as a key to return a cached rule.
122-
const prevDecl = this.raw[name]
123-
this.raw[name] = decl
124-
const newRule = createRule(name, decl, options)
125-
if (!newRule) {
126-
this.raw[name] = prevDecl
127-
return [null, null]
100+
const options = {...ruleOptions}
101+
if (oldIndex !== -1) {
102+
options.index = oldIndex
128103
}
129-
this.unregister(oldRule)
130-
this.register(newRule)
131-
132-
this.index.splice(oldIndex, 1, newRule)
133-
104+
const newRule = this.add(name, decl, options)
134105
return [oldRule, newRule]
135106
}
136107

‎packages/jss/src/StyleSheet.js

+15-20
Original file line numberDiff line numberDiff line change
@@ -55,8 +55,8 @@ export default class StyleSheet {
5555
const {queue} = this
5656

5757
// Plugins can create rules.
58-
// In order to preserve the right order, we need to queue all `.addRule` / `.replaceRule` calls,
59-
// which happen after the first `rules.add()` / `rules.replace()` call.
58+
// In order to preserve the right order, we need to queue all `.addRule` calls,
59+
// which happen after the first `rules.add()` call.
6060
if (this.attached && !queue) this.queue = []
6161

6262
const rule = this.rules.add(name, decl, options)
@@ -89,21 +89,27 @@ export default class StyleSheet {
8989

9090
/**
9191
* Replace a rule in the current stylesheet.
92-
* Nothing happens if old rule doesn't exist.
9392
*/
9493
replaceRule(name, decl, options) {
95-
const [oldRule, newRule] = this.rules.replace(name, decl, options)
94+
const oldRule = this.getRuleByName(name)
95+
if (!oldRule) return [oldRule, this.addRule(name, decl, options)]
9696

97-
if (oldRule === null || newRule === null) return [null, null]
97+
const [, newRule] = this.rules.replace(name, decl, options)
9898

99-
this.options.jss.plugins.onProcessRule(newRule)
99+
if (newRule) {
100+
this.options.jss.plugins.onProcessRule(newRule)
101+
}
100102

101103
if (this.attached) {
102104
if (!this.deployed) return [oldRule, newRule]
103-
// Don't replace rule directly if there is no stringified version yet.
105+
// Don't replace / delete rule directly if there is no stringified version yet.
104106
// It will be inserted all together when .attach is called.
105-
if (this.renderer && oldRule.renderable) {
106-
this.renderer.replaceRule(oldRule.renderable, newRule)
107+
if (this.renderer) {
108+
if (!newRule) {
109+
this.renderer.deleteRule(oldRule)
110+
} else if (oldRule.renderable) {
111+
this.renderer.replaceRule(oldRule.renderable, newRule)
112+
}
107113
}
108114
return [oldRule, newRule]
109115
}
@@ -115,17 +121,6 @@ export default class StyleSheet {
115121
return [oldRule, newRule]
116122
}
117123

118-
/**
119-
* replaceRule if rule with same name exists
120-
* or else, addRule
121-
*/
122-
upsertRule(name, decl, options) {
123-
if (this.getRuleByName(name)) {
124-
return this.replaceRule(name, decl, options)
125-
}
126-
return [null, this.addRule(name, decl, options)]
127-
}
128-
129124
/**
130125
* Insert rule into the StyleSheet
131126
*/

‎packages/jss/src/StyleSheet.js.flow

-1
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,6 @@ declare export default class StyleSheet {
2929
detach(): this;
3030
addRule(name: string, decl: JssStyle, options?: RuleOptions): Rule | null;
3131
replaceRule(name: string, decl: JssStyle, options?: RuleOptions): [Rule | null, Rule | null];
32-
upsertRule(name: string, decl: JssStyle, options?: RuleOptions): [Rule | null, Rule | null];
3332
insertRule(rule: Rule): void;
3433
addRules(styles: JssStyles, options?: RuleOptions): Array<Rule>;
3534
getRule(nameOrSelector: string): Rule;

‎packages/jss/src/index.d.ts

-11
Original file line numberDiff line numberDiff line change
@@ -223,24 +223,13 @@ export interface StyleSheet<RuleName extends string | number | symbol = string |
223223

224224
/**
225225
* Replace a rule in the current stylesheet.
226-
* Nothing happens if old rule doesn't exist.
227226
*/
228227
replaceRule(
229228
name: RuleName,
230229
style: JssStyle,
231230
options?: Partial<RuleOptions>
232231
): [Rule | null, Rule | null]
233232

234-
/**
235-
* replaceRule if rule with same name exists
236-
* or else, addRule
237-
*/
238-
upsertRule(
239-
name: RuleName,
240-
style: JssStyle,
241-
options?: Partial<RuleOptions>
242-
): [Rule | null, Rule | null]
243-
244233
insertRule(rule: Rule): void
245234
/**
246235
* Create and add rules.

‎packages/jss/src/plugins/conditionalRule.js

+1-11
Original file line numberDiff line numberDiff line change
@@ -61,20 +61,10 @@ export class ConditionalRule {
6161
*/
6262
replaceRule(name, style, options) {
6363
const [oldRule, newRule] = this.rules.replace(name, style, options)
64-
if (!oldRule || !newRule) return [null, null]
65-
this.options.jss.plugins.onProcessRule(newRule)
64+
if (newRule) this.options.jss.plugins.onProcessRule(newRule)
6665
return [oldRule, newRule]
6766
}
6867

69-
/**
70-
* replaceRule if rule with same name exists.
71-
* Or else, addRule
72-
*/
73-
upsertRule(name, style, options) {
74-
if (this.getRule(name)) return this.replaceRule(name, style, options)
75-
return [null, this.addRule(name, style, options)]
76-
}
77-
7868
/**
7969
* Generates a CSS string.
8070
*/

‎packages/jss/src/plugins/conditionalRule.js.flow

-1
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,6 @@ declare export class ConditionalRule implements ContainerRule {
2525
indexOf(rule: Rule): number;
2626
addRule(name: string, style: JssStyle, options?: RuleOptions): Rule | null;
2727
replaceRule(name: string, style: JssStyle, options?: RuleOptions): [Rule | null, Rule | null];
28-
upsertRule(name: string, style: JssStyle, options?: RuleOptions): [Rule | null, Rule | null];
2928
toString(options?: ToCssOptions): string;
3029
}
3130

0 commit comments

Comments
 (0)