Skip to content

Commit

Permalink
perf(utils): mitt default export is changed from Class to Function
Browse files Browse the repository at this point in the history
  • Loading branch information
anncwb committed Jun 19, 2021
1 parent ea6834a commit d3d620f
Show file tree
Hide file tree
Showing 8 changed files with 107 additions and 86 deletions.
2 changes: 2 additions & 0 deletions CHANGELOG.zh_CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,8 @@
### ⚡ Performance Improvements

- **Locale** 合并多语言文件,减少文件数量
- **Utils** Mitt 默认导出由 `Class` 改为 `Function`
- **Axios** `isTransformRequestResult`更名为`isTransformResponse`

### ✨ Features

Expand Down
4 changes: 2 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -111,7 +111,7 @@
"lint-staged": "^11.0.0",
"postcss": "^8.3.5",
"prettier": "^2.3.1",
"pretty-quick": "^3.1.0",
"pretty-quick": "^3.1.1",
"rimraf": "^3.0.2",
"rollup-plugin-visualizer": "5.5.0",
"stylelint": "^13.13.1",
Expand All @@ -120,7 +120,7 @@
"stylelint-order": "^4.1.0",
"ts-jest": "^27.0.3",
"ts-node": "^10.0.0",
"typescript": "4.3.3",
"typescript": "4.3.4",
"vite": "2.3.7",
"vite-plugin-compression": "^0.2.5",
"vite-plugin-html": "^2.0.7",
Expand Down
4 changes: 2 additions & 2 deletions src/components/SimpleMenu/src/components/Menu.vue
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
import { useDesign } from '/@/hooks/web/useDesign';
import { propTypes } from '/@/utils/propTypes';
import { createSimpleRootMenuContext } from './useSimpleMenuContext';
import Mitt from '/@/utils/mitt';
import mitt from '/@/utils/mitt';
export default defineComponent({
name: 'Menu',
props: {
Expand All @@ -44,7 +44,7 @@
},
emits: ['select', 'open-change'],
setup(props, { emit }) {
const rootMenuEmitter = new Mitt();
const rootMenuEmitter = mitt();
const instance = getCurrentInstance();
const currentActiveName = ref<string | number>('');
Expand Down
4 changes: 2 additions & 2 deletions src/components/SimpleMenu/src/components/SubMenuItem.vue
Original file line number Diff line number Diff line change
Expand Up @@ -77,7 +77,7 @@
import Icon from '/@/components/Icon';
import { Popover } from 'ant-design-vue';
import { isBoolean, isObject } from '/@/utils/is';
import Mitt from '/@/utils/mitt';
import mitt from '/@/utils/mitt';
const DELAY = 200;
export default defineComponent({
Expand Down Expand Up @@ -114,7 +114,7 @@
const { prefixCls } = useDesign('menu');
const subMenuEmitter = new Mitt();
const subMenuEmitter = mitt();
const { rootMenuEmitter } = useSimpleRootMenuContext();
Expand Down
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import type { InjectionKey, Ref } from 'vue';
import { createContext, useContext } from '/@/hooks/core/useContext';
import Mitt from '/@/utils/mitt';
import mitt from '/@/utils/mitt';

export interface SimpleRootMenuContextProps {
rootMenuEmitter: Mitt;
rootMenuEmitter: typeof mitt;
activeName: Ref<string | number>;
}

Expand Down
10 changes: 5 additions & 5 deletions src/logics/mitt/routeChange.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,30 +2,30 @@
* Used to monitor routing changes to change the status of menus and tabs. There is no need to monitor the route, because the route status change is affected by the page rendering time, which will be slow
*/

import Mitt from '/@/utils/mitt';
import mitt from '/@/utils/mitt';
import type { RouteLocationNormalized } from 'vue-router';
import { getRawRoute } from '/@/utils';

const mitt = new Mitt();
const emitter = mitt();

const key = Symbol();

let lastChangeTab: RouteLocationNormalized;

export function setRouteChange(lastChangeRoute: RouteLocationNormalized) {
const r = getRawRoute(lastChangeRoute);
mitt.emit(key, r);
emitter.emit(key, r);
lastChangeTab = r;
}

export function listenerRouteChange(
callback: (route: RouteLocationNormalized) => void,
immediate = true
) {
mitt.on(key, callback);
emitter.on(key, callback);
immediate && lastChangeTab && callback(lastChangeTab);
}

export function removeTabChangeListener() {
mitt.clear();
emitter.clear();
}
149 changes: 84 additions & 65 deletions src/utils/mitt.ts
Original file line number Diff line number Diff line change
@@ -1,73 +1,92 @@
/**
* Mitt: Tiny functional event emitter / pubsub
*
* @name mitt
* @param {Array} [all] Optional array of event names to registered handler functions
* @returns {Function} The function's instance
* https://github.com/developit/mitt
*/
export default class Mitt {
private cache: Map<string | Symbol, Array<(...data: any) => void>>;
constructor(all = []) {
// A Map of event names to registered handler functions.
this.cache = new Map(all);
}

once(type: string | Symbol, handler: Fn) {
const decor = (...args: any[]) => {
handler && handler.apply(this, args);
this.off(type, decor);
};
this.on(type, decor);
return this;
}
export type EventType = string | symbol;

// An event handler can take an optional event argument
// and should not return a value
export type Handler<T = any> = (event?: T) => void;
export type WildcardHandler = (type: EventType, event?: any) => void;

// An array of all currently registered event handlers for a type
export type EventHandlerList = Array<Handler>;
export type WildCardEventHandlerList = Array<WildcardHandler>;

// A map of event types and their corresponding event handlers.
export type EventHandlerMap = Map<EventType, EventHandlerList | WildCardEventHandlerList>;

export interface Emitter {
all: EventHandlerMap;

on<T = any>(type: EventType, handler: Handler<T>): void;
on(type: '*', handler: WildcardHandler): void;

off<T = any>(type: EventType, handler: Handler<T>): void;
off(type: '*', handler: WildcardHandler): void;

emit<T = any>(type: EventType, event?: T): void;
emit(type: '*', event?: any): void;
}

/**
* Mitt: Tiny (~200b) functional event emitter / pubsub.
* @name mitt
* @returns {Mitt}
*/
export default function mitt(all?: EventHandlerMap): Emitter {
all = all || new Map();

/**
* Register an event handler for the given type.
*
* @param {string|symbol} type Type of event to listen for, or `"*"` for all events
* @param {Function} handler Function to call in response to given event
*/
on(type: string | Symbol, handler: Fn) {
const handlers = this.cache?.get(type);
const added = handlers && handlers.push(handler);
if (!added) {
this.cache.set(type, [handler]);
}
}
return {
/**
* A Map of event names to registered handler functions.
*/
all,

/**
* Remove an event handler for the given type.
*
* @param {string|symbol} type Type of event to unregister `handler` from, or `"*"`
* @param {Function} handler Handler function to remove
*/
off(type: string | Symbol, handler: Fn) {
const handlers = this.cache.get(type);
if (handlers) {
handlers.splice(handlers.indexOf(handler) >>> 0, 1);
}
}
/**
* Register an event handler for the given type.
* @param {string|symbol} type Type of event to listen for, or `"*"` for all events
* @param {Function} handler Function to call in response to given event
* @memberOf mitt
*/
on<T = any>(type: EventType, handler: Handler<T>) {
const handlers = all?.get(type);
const added = handlers && handlers.push(handler);
if (!added) {
all?.set(type, [handler]);
}
},

/**
* Invoke all handlers for the given type.
* If present, `"*"` handlers are invoked after type-matched handlers.
*
* Note: Manually firing "*" handlers is not supported.
*
* @param {string|symbol} type The event type to invoke
* @param {*} [evt] Any value (object is recommended and powerful), passed to each handler
*/
emit(type: string | Symbol, evt?: any) {
for (const handler of (this.cache.get(type) || []).slice()) handler(evt);
for (const handler of (this.cache.get('*') || []).slice()) handler(type, evt);
}
/**
* Remove an event handler for the given type.
* @param {string|symbol} type Type of event to unregister `handler` from, or `"*"`
* @param {Function} handler Handler function to remove
* @memberOf mitt
*/
off<T = any>(type: EventType, handler: Handler<T>) {
const handlers = all?.get(type);
if (handlers) {
handlers.splice(handlers.indexOf(handler) >>> 0, 1);
}
},

/**
* Remove all event handlers.
*
* Note: This will also remove event handlers passed via `mitt(all: EventHandlerMap)`.
*/
clear() {
this.cache.clear();
}
/**
* Invoke all handlers for the given type.
* If present, `"*"` handlers are invoked after type-matched handlers.
*
* Note: Manually firing "*" handlers is not supported.
*
* @param {string|symbol} type The event type to invoke
* @param {Any} [evt] Any value (object is recommended and powerful), passed to each handler
* @memberOf mitt
*/
emit<T = any>(type: EventType, evt: T) {
((all?.get(type) || []) as EventHandlerList).slice().map((handler) => {
handler(evt);
});
((all?.get('*') || []) as WildCardEventHandlerList).slice().map((handler) => {
handler(type, evt);
});
},
};
}
16 changes: 8 additions & 8 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -9760,10 +9760,10 @@ pretty-format@^27.0.2:
ansi-styles "^5.0.0"
react-is "^17.0.1"

pretty-quick@^3.1.0:
version "3.1.0"
resolved "https://registry.npmjs.org/pretty-quick/-/pretty-quick-3.1.0.tgz#cb172e9086deb57455dea7c7e8f136cd0a4aef6c"
integrity sha512-DtxIxksaUWCgPFN7E1ZZk4+Aav3CCuRdhrDSFZENb404sYMtuo9Zka823F+Mgeyt8Zt3bUiCjFzzWYE9LYqkmQ==
pretty-quick@^3.1.1:
version "3.1.1"
resolved "https://registry.npmjs.org/pretty-quick/-/pretty-quick-3.1.1.tgz#93ca4e2dd38cc4e970e3f54a0ead317a25454688"
integrity sha512-ZYLGiMoV2jcaas3vTJrLvKAYsxDoXQBUn8OSTxkl67Fyov9lyXivJTl0+2WVh+y6EovGcw7Lm5ThYpH+Sh3XxQ==
dependencies:
chalk "^3.0.0"
execa "^4.0.0"
Expand Down Expand Up @@ -11765,10 +11765,10 @@ typescript-vscode-sh-plugin@^0.6.14:
resolved "https://registry.npmjs.org/typescript-vscode-sh-plugin/-/typescript-vscode-sh-plugin-0.6.14.tgz#a81031b502f6346a26ea49ce082438c3e353bb38"
integrity sha512-AkNlRBbI6K7gk29O92qthNSvc6jjmNQ6isVXoYxkFwPa8D04tIv2SOPd+sd+mNpso4tNdL2gy7nVtrd5yFqvlA==

[email protected].3:
version "4.3.3"
resolved "https://registry.npmjs.org/typescript/-/typescript-4.3.3.tgz#5401db69bd3203daf1851a1a74d199cb3112c11a"
integrity sha512-rUvLW0WtF7PF2b9yenwWUi9Da9euvDRhmH7BLyBG4DCFfOJ850LGNknmRpp8Z8kXNUPObdZQEfKOiHtXuQHHKA==
[email protected].4:
version "4.3.4"
resolved "https://registry.npmjs.org/typescript/-/typescript-4.3.4.tgz#3f85b986945bcf31071decdd96cf8bfa65f9dcbc"
integrity sha512-uauPG7XZn9F/mo+7MrsRjyvbxFpzemRjKEZXS4AK83oP2KKOJPvb+9cO/gmnv8arWZvhnjVOXz7B49m1l0e9Ew==

uglify-js@^3.1.4:
version "3.13.3"
Expand Down

0 comments on commit d3d620f

Please sign in to comment.