Debug-timing NPM

DebugTiming

Demo地址

页面资源/接口耗时监听可视化。performance的resource在监听接口的时候检测不出同名接口不同参数的接口区分，而且network耗时是不包含js执行耗时，所以增加XMLHttpRequest和fetch的接口调用耗时监听

debug图标显示/隐藏快捷键 shift + alt + G

API

参数	类型	说明	必填	默认值
isDrag	boolean	按钮是否需要拖拽	否	true
autoPos	boolean	按钮是否需要自动靠边	否	true
size	number	按钮大小	否	34
placement	't','tr','rt','r','rb','br','b','bl','lb','l','lt','tl'	按钮默认位置	否	'br'
alwaysShow	boolean	是否一直显示debug Icon	否	false
Icon	ReactElement	自定义icon	否	-

npm i debug-timing -D
yarn add debug-timing -D

import DebugTiming from 'debug-timing';

const App = () => {
  return (
    <div>
      {content}
      <DebugTiming />
    </div>
  );
};

ReactDOM.render(
  <App />,
  document.getElementById('Demo'),
);