Marky, a high-resolution JavaScript timer

Marky, by Nolan Lawson: JavaScript timer based on performance.mark() and performance.measure(), providing high-resolution timings as well as nice Dev Tools visualizations. For browsers that don’t support performance.mark(), it falls back to performance.now() or Date.now(). In Node, it uses process.hrtime(). The greatest win to me is the visualization in the Dev Tools timeline. After installing it …

Chrome DevTools Tip: Blackboxing Scripts

The Chrome DevTools have this neat feature where you can “blackbox” JavaScript source files. Upon blackboxing a script the debugger will jump over anything contained in that file when stepping in/out/over code, and not pause on any breakpoints also contained in that file. A typical example would be to blackbox the script of the JS …

Redux DevTools Chrome Extension

A Chrome DevTools Extension, wrapping around Redux DevTools: The Redux DevTools themselves are a live-editing time travel environment for Redux: Lets you inspect every state and action payload Lets you go back in time by “cancelling” actions If you change the reducer code, each “staged” action will be re-evaluated If the reducers throw, you will …

Chrome DevTools Custom Object Formatters

Here’s a little Chrome DevTools gem: it supports the use of custom Object formatters. Object what? Object formatters allow you to control how the value of a JavaScript object appears in Chrome’s console and debugger. Say you’d like to visualize a 2D vector, instead of seeing “just” { x: 1, y: 2} appear when pushing …

ng-inspector – The AngularJS inspector pane for your browser

ng-inspector is a browser extension for Chrome, Safari and Firefox that adds an inspector pane to help you develop, debug and understand your AngularJS applications. Handy tool to see how exactly the scopes are nested and such. ng-inspector →