UML or CASE tool to analyze *huge* JavaScript code base? - javascript

I have to figure out how a huge JavaScript code base works and I'm wondering if there are any CASE/UML tools to analyze its structure. I understand that there are several limitations because of the dynamic typing and existence of eval(), but I suppose if IDEs can offer meaningful inspections for JavaScript code these days, there must be some way to visualize dependencies, etc.

use JS/UML which is an eclipse plugin from jsuml.org

WAVI Web Application Viewer 2 (Node.js)
Generate a svg class diagram for your node.js web application.
WAVI is intended for developers who wish to document their web application or as a reverse engineering tool to recover the structure of a web application.
https://www.npmjs.com/package/wavi

Related

Embedding other programs in an Electron app

I have recently begun working with JavaScript and have learned of the Electron framework. I am very interested in this framework (and the whole web technologies for desktop use concept). My programming capabilities could be best described as hobbyist. I have written a few small games and apps for my own use, and have a number of shell scripts to help me automate some of my workflow in Linux. My question is, is it possible to use an Electron app that is powered by a language other than JavaScript? For example, I have a bunch of Python scripts (and recently, some Haskell and F# ones too) to help me with my statistics, calculus, and accounting courses in school. I don't mind running a bunch of different scripts to do what I want but lately I've gotten the idea of potentially making some of them available for general distribution. But my scripts are, as I mentioned, written in several different languages, most of them functional languages and none of them in JavaScript. Is it possible to wrap these scripts into something like an Electron app? If not, does JavaScript have any features similar to a functional language? How would one go about creating a JavaScript library or framework to fullfil this need?
I am aware of platforms like SageMath and GNU Octave, but the whole point is to create something of my own.
I would appreciate any thoughts or suggestions. Thank you.
The short answer is there's no direct/easy way to do what you want.
But you have some options.
There's a Electron compiler, but it works only with Javascript based languages like TypeScript and CoffeeScript.
You can, of course, develop a local web application and communicate with your Electron UI using HTTP requests, here is an example using Python.
You can also use sockets for interprocess communication: https://www.npmjs.com/package/electron-ipc-socket
And you also has the option to just start a child process directly from your Electron Application.
Hope it helps and don't make you more confuse :)

Can I use EmberJS or other frameworks without gettting its server up?

I want a javascript framework which has features like below:
MV*
Well structured
Html file as template
Rendering fast(maybe virtual dom?)
Combine and compatible with other plugins or libraries
Edit on tablet IDE apps and view in browser immediately by refreshing page after I changed code
When I am at home, I use PC to develop my client-side(or front-end) applications.
When go out, I use my tablet(I have no note PC), so I want to develop my applications outside.
*There are some excellent IDE apps on the Android Market.
Before I know Ember, I have been using pure javascript(jquery) + css + html to develop client-side application for daily practices or work.
But recently, when I began to learn EmberJS, a Javascript MVC framwork, I am lost.
It seems that EmberJS have to get its own server up to compile something, which generate static contents for browser rendering.
I just want to get my client-side code(files) rendering in the browser, but why I have to 'run' it as if I get apache started to serve as a php back-end.
I have googled hundreds of pages to find a solution, nothing expected result discovered.
Including Angular, backbone or any other popular Javascript MV* frameworks, they all must compile there applications.
Is there anyone who has encountered this situation?
Then any advice, please?
Increasingly most Javascript frameworks are shifting to doing a "compile step" as part of using them. This allows you to do a variety of changes to your Javascript files, which in turn makes it easier for you as a developer. An example of this is that you can use ES2015 classes and then have your compile step "transpile" them to older Javascript that will work in all browsers.
The side effect of this though is that you need to have npm running on your computer to be able to do this well.
If you really don't want to have the compile step, then I would suggest looking at VueJS. It's the only recent Javascript framework that allows working with simple non-compiled JS files. But you'all be missing out on some of the best changes to Javascript as a result (ES2015 has made life much better)
Finally, I found a nice solution(framework) that is Durandal.
Really, pure HTML+Javascript without built and server up(anyhow, a web server needed if I wanted to publish it in my hosted web server).
.html extension and designer friendly.
I can upload its source files directly in to S3 and browse the html pages.
Just found some nice examples with well structured project on github is here.
And I can work smoothly with my dear designer friends.
Though its next generation Aurelia will also be built and serve it up like Ember or others, but the current generation is enough for me.
Hope those one got help from this;)

Graph visualization frameworks

I want to visualize a Neo4j database in a graphical application. (I'm doing this primarily as a learning exercise).
I want it to behave almost identically to the visualization in Neo4j's WebAdmin: When the graphic appears, I want to see the nodes moving around as they settle into their final locations, and I want the user to be able to click and drag node icons around the screen and have them stick where they are dropped, with the rest of the graph adjusting to account for the change.
I have two questions.
What are the technical terms for the three requirements crudely described in the paragraph above?
I'm a Java programmer with no experience in JavaScript, but I'm thinking that, with this project, it's time to get some - sigma.js in particular seems very powerful and relatively simple. However, ultimately this needs to be done within a Java Swing application, and while I know there are various containers I can use to embed JS/HTML content into Swing, still it seems that a pure Java solution would be ideal, and I'm curious about any frameworks that might make this possible. I'm looking into Gephi now, but it doesn't seem anywhere near as powerful or as simple to use as sigma.js. Am I wrong in this assumption?
To summarize the second question: Which would be the better investment of my time: Learning sigma.js and the various JS frameworks (which will require me to get comfortable with JS in general), or learning to use Gephi in Java? (assuming I have a general and long-term interest in graph visualization)
Java visualization
Gephi does provide a toolkit for Java and Python which doesn't contains the UI modules, so unless you want to use Gephi itself to visualise your network you cannot embed its UI in your Java/Swing application as long as I know.
The toolkit contains all the algorithms and plugin infrastructure so if you want to use some of their analysis tool embedded in your app you can use that, otherwise I don't think it's your case.
There are other Java options if you want for graph visualisation here: Java graph library for dynamic visualisation
About Gephi and sigmaJS
IMHO Gephi is far more powerful than sigma.js: it has full SNA tools, multiple layouts, a data editor, exporters, plugin-systems...
One important factor is also the size of the dataset you want to visualise: while sigmaJS can handle up to 500 nodes in the view, Gephi can layout easily 50000 nodes with GPU support as well.
Gephi is a scientific tool made for people that don't want to code to visualise a network and it does it's job. SigmaJS is one of many JS solutions to visualise graphs on a web page.
You can always export to sigmaJS from Gephi with a plugin.
What's better?
At the end of the story I guess the tool you are going to use will depends on:
do you have to visualise a big dataset? -> Java solutions will win for big ones
do you need to distribute it easily? -> Web app / SigmaJS wins for distributed
do you want to have a full integration with your app? -> Java wins
The best one I've found is Keylines, but its not cheap.
Gephi is OK, but the last time I looked it did not support Neo4j 2.0
If your a programmer Neo4j is open source, so you can fork the repository on Git and use that (you will have to check the licencing model before you commercialise any product though)

Tool for analyzing and graphing dependency between Javascript functions

Is there a program/tool that can generate function dependency graph for javascripts? Basically, the input should be a folder of javascript files, then the output is a nice graph that show all the relations between each function. It'll be better if I can interact with the graph, also.
Is there a way to do that?
Thanks
On windows and Visual Studio you can look at JSAnalyse: http://jsanalyse.codeplex.com/
I haven't tried it, but from the description, it parse the JavaScript files and creates a dependency tree of the different files based on the static references between them.
The project
JSAnalyse is a tool to analyze the dependencies between JavaScript
files and keep them under control. It helps to visualize and handle
static references between JavaScript files in order to ensure the
defined client-side architecture.
In the last couple years the amount of JavaScript lines in web
applications has been dramatically increased. A lot of new client-side
frameworks (like JQuery, Knockout, etc...) have aroused, but the tools
for developing JavaScript just got slightly better. For instance, the
Visual Studio 2010 has improved the IntelliSense. But for a
well-designed application, not only the server-side code is relevant
anymore. It is also very important to have a good architecture for the
client-side code and to keep it in a healthy and good state during the
whole application lifecycle. That is exactly when JSAnalyse comes into
play. It enables not just the possibility to analyze the existing
JavaScript dependencies but also to constrain them. The allowed
dependencies can be either configured via XML or by using the great
Visual Studio 2010 Architecture features. JSAnalyse provides an
extension for the Visual Studio Layer Diagram to validate and control
also dependencies between JavaScript files. This can be integrated
into the build and with the Gated Check-in feature it is not even
possible to check-in source code which does not fulfill the JavaScript
architectural rules.

Live accessibility Checker

I am wondering if anyone knows of any program / tool / or addon that offers a feature like the Live Accessibility Checker in Microsoft Office Word for html coding.
I think it would be great to be able to offer our developers something like this that flags accessibility errors as they are coding them.
There are many tools for checking conformance with Web Content Accessibility Guidelines (WCAG) of published websites such as WAVE and Total Validator. A full list is maintained on the W3 website: http://www.w3.org/WAI/RC/tools/complete
However it doesn't appear there are any for checking within an IDE as you're coding, which is what you're looking for. The nearest would be if you're developing something like PHP / classic ASP where changes can be constantly published to a test website and a check subsequently performed with one of these external tools.
In general currently I think that's the best option to consider, including into any build scripts a call to an external tool for WCAG check and potentially parsing the output for number of non-compliances. It doesn't meet the 'live' check, but probably about the next best.
EDIT - one possible tool that may fit the bill (for users of Eclipse IDEs) : http://www.eclipse.org/actf/
The ACTF componentry and the utilities
will be integrated into a single
tooling environment on top of the
Eclipse framework. The framework
components will function cooperatively
with each other and with other Eclipse
projects to provide a comprehensive
development environment for creating
accessible applications and content.
I haven't worked with any IDE that has had an on the fly accessibility checker while you code, but I use http://wave.webaim.org/ sometimes.

Categories

Resources