Code Monkey home page Code Monkey logo

analyze.js's Introduction

analyze.js Build Status

analyze.js is a tool to analyze applications which rely on node or JavaScript or any language which compiles to JavaScript. The dynamic analysis process focuses on protocolling function invocations as well as determining module dependencies and various runtime characteristics.

analyze.js consists of:

  • a back-end which proxies a local webapp and instruments requested JavaScript files on the fly
  • a front-end which provides an overview of the analyzed characteristics

analyze.js is currently work in progress.

Motivation

The main goal of analyze.js is to simplify understanding of code (especially in large code bases). Common use cases are familiarizing with a project as well as refactoring, debugging and reverse engineering. Optimizing performance is also a possible use case, but it is not a central goal since there are already other very good tools facilitating this (especially the Chrome Dev Tools).

How to use

analyze.js functions as a proxy so that web apps can be analyzed very easily without having to integrate in a certain build system or back-end. Let's say you got an app running on localhost:proxiedPort. In order to analyze the app, analyze.js will create a proxy server (running on localhost:proxyPort), which you can visit to see the original app and the analyzation results.

Follow these steps to set up analyze.js:

  • Checkout this repository (analyze.js isn't available via npm yet)
  • cd into the project directory
  • npm install
  • gulp watch --proxiedPort proxiedPort --proxyPort proxyPort
  • Visit localhost:proxyPort/analyzejs/ in your browser (preferably Chrome; other browsers are not tested, yet)
    • When the site is loaded, localhost:proxiedPort will be opened automatically in a new window (check your popup blocker!).

FAQ

When opening localhost:proxyPort, I get a Uncaught TypeError: Cannot read property 'app' of null error in the console?

As it is stated in the "How to use" section, you have to visit localhost:proxyPort/analyzejs/.

When opening localhost:proxyPort/analyzejs/, the page stays empty?

Check your popup blocker. analyze.js will open localhost:proxyPort in a new window.

Why aren't there any calls to jQuery/requireJS/XYZ?

At the moment there is a blacklist of common libraries and frameworks which don't get instrumented (blacklist.txt). Since these JavaScript files tend to get called very often and are usually not of interest, they will be ignored. This enhances performance when running the analyzed webapp and when rendering the front-end.

Why is analyze.js so slow?

Presumably, your webapp uses a library/framework which gets called very often, but isn't blacklisted (see the previous question). Please extend blacklist.txt or open an issue. Currently, I'm working on tuning performance. Maybe you want to check back in a few weeks.

Can I get notified about future releases of analyze.js?

Yes! Visit this issue and click on "subscribe".

How can I contribute to the project?

Just test it, star it on GitHub or open issues. You also can submit a Pull Request, but please open an issue before so we can discuss the idea and no work is done twice.

Screenshots

The main view:

Main View

WIP...

License

MIT © Philipp Otto 2014

analyze.js's People

Contributors

philippotto avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

analyze.js's Issues

Support for Webworker

At the moment an error is thrown when running a webworker, because webworker don't have a reference to window. State could be serialized/sent via websockets which would also be helpful for analyzing node modules.

Firefox Support

Currently there occurs an error when evaluating the instrumented Immutable.js library in Firefox. The error message is: quoteString is not defined.

Release announcements

This issue is used for announcing new releases of analyze.js. Click on "subscribe" on the right side, to get notified about new releases.

Low rendering performance when using search

There is a noticeable lag when typing in the search box. The InvocationContainer class already uses the PureRenderMixin which improves the situation a little bit. But it stays laggy.

Maybe the deep and nested hierarchy of InvocationContainers is the cause?

Some performance measurements:
image

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.