Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Speedup 3 1 shared mods #1486

Merged
merged 16 commits into from
Nov 13, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 3 additions & 6 deletions build/graph/component-params.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,7 @@ const
$C = require('collection.js'),
escaper = require('escaper');

const
fs = require('node:fs');
const fs = require('node:fs');

const {
componentRgxp,
Expand Down Expand Up @@ -67,8 +66,7 @@ Object.assign(componentParams, {
* Load component runtime parameters to a map
*/
componentFiles.forEach((el) => {
const
escapedFragments = [];
const escapedFragments = [];

const
file = escaper.replace(fs.readFileSync(el).toString(), escapedFragments),
Expand All @@ -94,8 +92,7 @@ componentFiles.forEach((el) => {
parent
};

const
obj = componentParams[component];
const obj = componentParams[component];

obj.deprecatedProps = p.deprecatedProps ?? {};

Expand Down
4 changes: 2 additions & 2 deletions build/snakeskin/default-filters.js
Original file line number Diff line number Diff line change
Expand Up @@ -204,8 +204,8 @@ function tagFilter({name: tag, attrs = {}}, _, rootTag, forceRenderAsVNode, tplN
attrs[':componentIdProp'] = [`componentId + ${JSON.stringify(id)}`];
}

if (component.inheritMods !== false && !attrs[':mods'] && !attrs[':modsProp']) {
attrs[':mods'] = ['provide.mods()'];
if (component.inheritMods !== false) {
attrs[':inheritMods'] = ['sharedMods != null'];
}

Object.entries(attrs).forEach(([name, val]) => {
Expand Down
3 changes: 1 addition & 2 deletions src/components/base/b-dynamic-page/b-dynamic-page.ts
Original file line number Diff line number Diff line change
Expand Up @@ -325,7 +325,6 @@ export default class bDynamicPage extends iDynamicPage {
if (passedProps != null) {
const rejectedProps = {
is: true,
keepAlive: true,
dispatching: true,
componentIdProp: true,
getRoot: true,
Expand All @@ -334,7 +333,7 @@ export default class bDynamicPage extends iDynamicPage {
};

Object.entries(passedProps).forEach(([propName, prop]) => {
if (rejectedProps.hasOwnProperty(propName)) {
if (rejectedProps.hasOwnProperty(propName) || this.meta.props.hasOwnProperty(propName)) {
return;
}

Expand Down
14 changes: 7 additions & 7 deletions src/components/friends/block/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -233,7 +233,7 @@ To disable modifier inheritance, pass the `inheridMods: false` option when creat
```typescript
import iBlock, { component } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {}
```

Expand All @@ -246,7 +246,7 @@ Please note that the key must be in a dash style, i.e., normalized.
```typescript
import iBlock, { component, ModsDecl } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {
static mods: ModsDecl = {
theme: [
Expand All @@ -266,7 +266,7 @@ This property can be observed using the watch API.
```typescript
import iBlock, { component, ModsDecl } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {
static mods: ModsDecl = {
theme: [
Expand Down Expand Up @@ -310,7 +310,7 @@ To set a new modifier value or remove an old one, you must use the `setMod` and
```typescript
import iBlock, { component, ModsDecl } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {
static mods: ModsDecl = {
theme: [
Expand Down Expand Up @@ -343,7 +343,7 @@ inside and outside the component.
```typescript
import iBlock, { component, ModsDecl } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {
static mods: ModsDecl = {
theme: [
Expand Down Expand Up @@ -380,7 +380,7 @@ this can be more convenient than handling each event individually.
```typescript
import iBlock, { component, ModsDecl } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {
static mods: ModsDecl = {
theme: [
Expand Down Expand Up @@ -427,7 +427,7 @@ __b-example.ts__
```typescript
import iBlock, { component, ModsDecl } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {
mounted() {
const
Expand Down
12 changes: 6 additions & 6 deletions src/components/friends/field/delete.ts
Original file line number Diff line number Diff line change
Expand Up @@ -164,26 +164,26 @@ export function deleteField(
prop = keyGetter ? <PropertyKey>keyGetter(chunks[0], ref) : chunks[0];

if (chunks.length > 1) {
chunks.some((chunk, i) => {
for (let i = 0; i < chunks.length; i++) {
const chunk = chunks[i];

prop = keyGetter ? <PropertyKey>keyGetter(chunk, ref) : chunk;

if (i + 1 === chunks.length) {
return true;
break;
}

const newRef = Object.isMap(ref) ? ref.get(prop) : ref[prop];

if (newRef == null || typeof newRef !== 'object') {
needDelete = false;
return true;
break;
}

ref = newRef;
return false;
});
}
}

// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
if (needDelete) {
if (needDeleteToWatch) {
ctx.$delete(ref, prop);
Expand Down
12 changes: 4 additions & 8 deletions src/components/friends/field/get.ts
Original file line number Diff line number Diff line change
Expand Up @@ -149,9 +149,11 @@ export function getField<T = unknown>(
}

} else {
const hasNoProperty = chunks.some((chunk) => {
for (let i = 0; i < chunks.length; i++) {
const chunk = chunks[i];

if (res == null) {
return true;
return undefined;
}

if (Object.isPromiseLike(res) && !(chunk in res)) {
Expand Down Expand Up @@ -186,12 +188,6 @@ export function getField<T = unknown>(
res = typeof obj !== 'object' || chunk in obj ? obj[chunk] : undefined;
}
}

return false;
});

if (hasNoProperty) {
return undefined;
}
}

Expand Down
10 changes: 5 additions & 5 deletions src/components/friends/field/set.ts
Original file line number Diff line number Diff line change
Expand Up @@ -165,11 +165,13 @@ export function setField<T = unknown>(
let prop = keyGetter ? <PropertyKey>keyGetter(chunks[0], ref) : chunks[0];

if (chunks.length > 1) {
chunks.some((chunk, i) => {
for (let i = 0; i < chunks.length; i++) {
const chunk = chunks[i];

prop = keyGetter ? <PropertyKey>keyGetter(chunk, ref) : chunk;

if (i + 1 === chunks.length) {
return true;
break;
}

type AnyMap = Map<any, any>;
Expand Down Expand Up @@ -198,9 +200,7 @@ export function setField<T = unknown>(
} else {
ref = ref[prop];
}

return false;
});
}
}

// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
Expand Down
22 changes: 9 additions & 13 deletions src/components/friends/provide/mods.ts
Original file line number Diff line number Diff line change
Expand Up @@ -33,24 +33,20 @@ import type { Mods } from 'components/friends/provide/interface';
* ```
*/
export function mods(this: Friend, mods?: Mods): CanNull<ModsDict> {
const {sharedMods} = this.ctx;

if (sharedMods == null && mods == null) {
if (mods == null) {
return null;
}

const resolvedMods = {...sharedMods};

if (mods != null) {
const modNames = Object.keys(mods);
const
resolvedMods = {},
modNames = Object.keys(mods);

for (let i = 0; i < modNames.length; i++) {
const
modName = modNames[i],
modVal = mods[modName];
for (let i = 0; i < modNames.length; i++) {
const
modName = modNames[i],
modVal = mods[modName];

resolvedMods[modName.dasherize()] = modVal != null ? String(modVal) : undefined;
}
resolvedMods[modName.dasherize()] = modVal != null ? String(modVal) : undefined;
}

return resolvedMods;
Expand Down
9 changes: 2 additions & 7 deletions src/components/friends/provide/test/unit/main.ts
Original file line number Diff line number Diff line change
Expand Up @@ -89,14 +89,9 @@ test.describe('friends/provide', () => {
});

test.describe('`mods`', () => {
test('should return a dictionary of active modifiers and their values', async () => {
await test.expect(target.evaluate(({provide}) => provide.mods()))
.resolves.toEqual({foo: 'bar'});
});

test('should return a dictionary of active and provided modifiers and their values', async () => {
test('should return a dictionary of provided modifiers and their values', async () => {
await test.expect(target.evaluate(({provide}) => provide.mods({baz: 'bla'})))
.resolves.toEqual({foo: 'bar', baz: 'bla'});
.resolves.toEqual({baz: 'bla'});
});
});

Expand Down
22 changes: 11 additions & 11 deletions src/components/super/i-block/mods/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -188,11 +188,11 @@ To disable modifier inheritance, pass the `inheridMods: false` option when creat
```typescript
import iBlock, { component } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component({inheridMods: false})
class bExample extends iBlock {}
```

### Getting a Component's Modifier Value
### Getting a Component Modifier Value

All component's applied modifiers are stored in the `mods` read-only property.
Therefore, to get the value of any modifier, simply access the desired key.
Expand All @@ -201,7 +201,7 @@ Note that the key should be in kebab case, i.e., normalized.
```typescript
import iBlock, { component, ModsDecl } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {
static mods: ModsDecl = {
theme: [
Expand All @@ -221,7 +221,7 @@ This property can be observed using the watch API.
```typescript
import iBlock, { component, ModsDecl } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {
static mods: ModsDecl = {
theme: [
Expand Down Expand Up @@ -258,14 +258,14 @@ If you want to use modifiers within a component template, then use the `m` gette
...
```

### Setting a New Component's Modifier Value
### Setting a New Component Modifier Value

To set a new modifier value or remove an existing one, you can use the `setMod` and `removeMod` methods.

```typescript
import iBlock, { component, ModsDecl } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {
static mods: ModsDecl = {
theme: [
Expand Down Expand Up @@ -299,7 +299,7 @@ These events provide a way to react to changes in modifiers and perform any nece
```typescript
import iBlock, { component, ModsDecl } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {
static mods: ModsDecl = {
theme: [
Expand Down Expand Up @@ -336,7 +336,7 @@ it can be more convenient than handling each event separately.
```typescript
import iBlock, { component, ModsDecl } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {
static mods: ModsDecl = {
theme: [
Expand Down Expand Up @@ -410,7 +410,7 @@ Note that the method returns the normalized value of the modifier.
```typescript
import iBlock, { component } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {
mounted() {
this.setRootMod('foo', 'blaBar');
Expand All @@ -431,7 +431,7 @@ The method uses the component's `globalName` prop if provided, otherwise it uses
```typescript
import iBlock, { component } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {
mounted() {
// this.componentName === 'b-button' && this.globalName === undefined
Expand All @@ -453,7 +453,7 @@ The method uses the component `globalName` prop if it's provided. Otherwise, the
```typescript
import iBlock, { component } from 'components/super/i-block/i-block';

@component({inheritMods: false})
@component()
class bExample extends iBlock {
mounted() {
this.setRootMod('foo', 'bla');
Expand Down
7 changes: 1 addition & 6 deletions src/components/super/i-block/mods/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -26,13 +26,8 @@ export default abstract class iBlockMods extends iBlockEvent {
@system({atom: true, merge: mergeMods, init: initMods})
override readonly mods!: ModsDict;

@computed({cache: 'forever'})
override get sharedMods(): CanNull<ModsDict> {
const m = this.mods;

if (m.theme != null) {
return {theme: m.theme};
}

return null;
}

Expand Down
Loading