All Projects → localvoid → Perf Monitor

localvoid / Perf Monitor

Licence: mit
Performance monitor. Simple UI component that helps you measure performance.

Programming Languages

typescript
32286 projects

Projects that are alternatives of or similar to Perf Monitor

Browser Metrics
A collection of metrics tools for measuring performance ⚡️
Stars: ✭ 115 (+0%)
Mutual labels:  performance, browser
Browser Interaction Time
⏰ A JavaScript library (written in TypeScript) to measure the time a user is active on a website
Stars: ✭ 175 (+52.17%)
Mutual labels:  performance, browser
Irodr
RSS reader client like LDR for Inoreader.
Stars: ✭ 110 (-4.35%)
Mutual labels:  browser
Scipy 2017 Cython Tutorial
Material for the SciPy 2017 Cython tutorial
Stars: ✭ 114 (-0.87%)
Mutual labels:  performance
Jvm Profiler
JVM Profiler Sending Metrics to Kafka, Console Output or Custom Reporter
Stars: ✭ 1,558 (+1254.78%)
Mutual labels:  performance
Simple Fs
Handles files on indexeddb like you would do in node.js (promise)
Stars: ✭ 111 (-3.48%)
Mutual labels:  browser
Finicky
A macOS app for customizing which browser to start
Stars: ✭ 2,026 (+1661.74%)
Mutual labels:  browser
Quitnow Cache
A collection to store data for a given time
Stars: ✭ 109 (-5.22%)
Mutual labels:  performance
Anti Webminer
Anti-WebMiner protects your PC against web cryptocurrency miners (JS scripts like Coinhive executed in the browser) by modifying Windows hosts file
Stars: ✭ 114 (-0.87%)
Mutual labels:  browser
Ansible Role Haproxy
Ansible Role - HAProxy
Stars: ✭ 112 (-2.61%)
Mutual labels:  performance
Itoa
Fast integer to ascii / integer to string conversion
Stars: ✭ 111 (-3.48%)
Mutual labels:  performance
Decentraleyes
This repository has a new home: https://git.synz.io/Synzvato/decentraleyes
Stars: ✭ 1,452 (+1162.61%)
Mutual labels:  browser
Emacs Application Framework
A free/libre and open-source extensible framework that revolutionizes the graphical capabilities of Emacs, the key to ultimately Live in Emacs
Stars: ✭ 1,932 (+1580%)
Mutual labels:  browser
Instagram Profilecrawl
💻 Quickly crawl the information (e.g. followers, tags, etc...) of an instagram profile. No login required!
Stars: ✭ 110 (-4.35%)
Mutual labels:  browser
Laravel Blink
Cache that expires in the blink of an eye
Stars: ✭ 114 (-0.87%)
Mutual labels:  performance
Easy profiler
Lightweight profiler library for c++
Stars: ✭ 1,594 (+1286.09%)
Mutual labels:  performance
Browserinterop
Wrapper for Browser JS API for Blazor and JSInterop
Stars: ✭ 112 (-2.61%)
Mutual labels:  browser
Sielo Legacy
An open source browser made with Qt and WebEngine
Stars: ✭ 113 (-1.74%)
Mutual labels:  browser
Blog
oh~~
Stars: ✭ 115 (+0%)
Mutual labels:  performance
Nmonvisualizer
A Java GUI tool for analyzing NMON system files
Stars: ✭ 114 (-0.87%)
Mutual labels:  performance

Performance monitor. Simple UI component that helps you measure performance. Demo

Example

<!doctype html>
<html>
<head>
  <title>perf monitor example</title>
</head>
<body>
  <script src="https://unpkg.com/[email protected]^0.3/dist/umd/perf-monitor.js"></script>
  <script>
    // initProfiler will create a new monitor component and inject it into your
    // document.
    perfMonitor.initProfiler('a');
    perfMonitor.initProfiler('b');

    function tick() {
      // save start time of the profiled code
      perfMonitor.startProfile('a');
      let a = Math.random();
      for (let i = 0; i < 100; i++) {
        a += Math.random();
      }
      // measure time between the start of the profiled code and the current time
      perfMonitor.endProfile('a');

      perfMonitor.startProfile('b');
      let b = Math.random();
      for (let i = 0; i < 100; i++) {
        b *= Math.random();
      }
      perfMonitor.endProfile('b');

      console.log(a);
      console.log(b);

      setTimeout(tick, 30);
    }

    setTimeout(tick, 30);
  </script>
</body>
</html>

NPM Package

Npm package perf-monitor provides umd module, es6 module and TypeScript typings.

API

initPerfMonitor(options: PerfMonitorOptions)

Initialize performance monitor. If perf monitor isn't initialized with this function, it will use default options.

Options:

  • container: HTMLElement

startFPSMonitor(flags?: MonitorWidgetFlags)

Add FPS monitor.

startMemMonitor(flags?: MonitorWidgetFlags)

Add Memory Monitor if browser has window.performance.memory object.

initProfiler(name: string, flags: MonitorWidgetFlags = 0)

Add code profiler monitor.

initCounter(name: string, interval?: number)

Add counter. Optional interval parameter sets sliding window interval.

startProfile(name: string)

Save start time of the profiled code.

endProfile(name: string)

Measure time between the start of the profiled code and the current time.

count(name: string, value = 1)

Increments counter.

MonitorWidgetFlags

enum MonitorWidgetFlags {
  HideMin     = 1,
  HideMax     = 1 << 1,
  HideMean    = 1 << 2,
  HideLast    = 1 << 3,
  HideGraph   = 1 << 4,
  RoundValues = 1 << 5,
}

MonitorSamples

interface MonitorSamples {
  readonly samples: number[];
  readonly maxSamples: number;
}

ProfilerDetails

interface ProfilerDetails {
  data: MonitorSamples;
  widget: MonitorWidget;
  startTime: number;
}

Counter

interface Counter {
  value: number;
}

CounterDetails

interface CounterDetails {
  data: Counter;
  widget: CounterWidget;
}

getProfile(name: string): ProfilerDetails | null

Lookup a profile by name

getCounter(name: string): CounterDetails | null

Lookup a counter by name

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].