[HOME]

Web apps and JavaScript in Science

This page holds continuously updated content related to the articles in Informatics 2017 and Trends in Biotechnology. For hyperlinked tables related to these articles, scroll down or click here.


Some web apps:

PCA

Principal Components Analysis calculated with LALOlib and displayed with Google Charts: For simple inspection of similarities and differences among complex objects.

CD

Protein Circular Dichroism Fitter and Simulator through library-free calculations.

PubmedMining

Literature Reporter based on Entrez Utils API and nlp-compromise: Retrieves recent abstracts that mention proteins from a list, removes author names, affiliations and stopwords, and lists the most frequent terms thus providing a glance at the core of the abstract.

With a more interesting application, also check out the PubMed protein mutation miner

eye-gazing

Eye tracking-based control of 3D molecular visualizations by coupling WebGazer to JSmol: Uses the webcam to track user's eyes and move a 3D molecule rendered in JSmol.


Thinking about the future of molecular modeling and visualization (also see the Web Augmented Reality for Chemistry portal)

arjssmallmol

Exploring molecules in 3D through Augmented Reality in few lines of code, by integrating Three.js, A-Frame and AR.js: Uses the webcam to detect two markers and thus move a glutamate and lysine sidechains around, returning distances and electrostatic energy between lysine N and glutamate O atoms.

This other version suited for phones, which vibrate when atoms clash [see video here]

ubiquim

Interactive manual + voice-activated force field-based docking of two proteins (ubiquitin-interacting motif onto ubiquitin) achieved by moving the molecules with two markers and switching the forcefield on and off through voice commands (say "computer" and then "activate forcefield" and then "stop forcefield" to stop). You can watch a video demo here

cryoem

Interactive manual fitting of protein inside simulated volumetric map (which could come from SAXS or cryo EM data)

concurrent

Concurrent JSmol sessions from multiple devices: Uses WebRTC through PeerJS to transmit molecular orientation and commands from and to JSmol applets in different browsers, allowing concurrent collaborative molecular visualization in 3D over the WWW.


 

Other JS/HTML-only sample applications from the author

 



Hyperlinked Tables related to the Informatics 2017 and Trends in Biotechnology articles (continuously updated)

 

Table 1. Web apps and libraries of use in molecular biosciences, that rely entirely or largely on JavaScript, described in scientific literature. See text for details on many of these tools.

Tool and Link

Brief Description

Data visualization

Protael

Protein data visualization library for the web.

JSAV

The first JavaScript-based interactive sequence alignment viewer.

MSAViewer

Interactive JavaScript visualization of multiple sequence alignments.

jHeatmap

Library to display HeatMaps in the browser.

BioJS

Framework for biological data visualization.

PhyD3

Library for phylogenetic tree visualization in the browser.

Molecular visualization and editing

Jolecule

Probably the first JavaScript/WebGL-based molecular viewer

JSmol

A full molecular viewer and editor program and library. See text for details.

NGL Viewer, 3Dmol.js, PV, Molmil, LiteMol

Various molecular viewers which profit from WebGL technologies better than JSmol providing nicer and smoother rendering, but which are much more limited in capabilities beyond visualization. Most work as embeddable libraries but are also available as full web apps.

JSME

A library to create and edit small molecules graphically, often used as the starting point for subsequent calculations or database queries.

HTMoL

Specially designed to efficiently transfer and visualize raw MD trajectory files on web browsers.

CH5M3D, Chemozart

Libraries to edit molecules in 3D.

Full web applications

PsychoProt

A tool to analyze amino acid variation in proteins in terms of protein physical chemistry, to aid in the analysis of sequence alignments and deep-sequencing-based tolerance to substitutions maps.

CASP12 tertiary structure assessment web app

CASP12 web app for assessment of hard modeling targets.

Sequence Manipulation Suite

A collection of tools to handle, build, and analyze DNA and protein sequences.

PDB-Explorer

An interactive map to browse the Protein Data Bank.

Wikipedia Chemical Structure Explorer

An interactive 2D structure and substructure search engine for small molecules inside Wikipedia.

ChemCalc.org

Calculates molecular formulas, molecular weights, elemental compositions, and isotopic distribution. Works as full web app or as an API for JavaScript calls.

ChemInfo.org

A portal to a variety of web-based tools for cheminformatics and related fields, including the PDBExplorer and ChemCalc listed above.

 

Table 2. Some unreferenced web apps of direct use in molecular biosciences, that rely entirely or largely on JavaScript.

<![if !supportMisalignedColumns]><![endif]>

Tool and Link

Brief Description

Data visualization

Comparing residue contact predictions and protein contact maps

Web apps to compare protein contact maps from structures or models to residue-residue contact predictions from Gremlin [21], EVFold [22], and RaptorX [23].

Augmenting article figures of molecular visualization and other data

Interactive visualization of data and 3D structures/models from published articles.

Molecular visualization and editing; cheminformatics

Hack-a-mol

Interconvert 2D and 3D molecular structures, SMILES and other codes, and coordinate files in several formats.

Virtual Molecular Model Kit

A web app that provides easy access to JSmol’s model editing ability, also using JSME and API calls to external webservices and databases to provide a full online molecular modeling experience.

PDB manipulation suite

A growing suite of functions for manipulating PDB files online, for example shifting residue numbers, getting amino acid sequences, and mapping data to B-factors.

C6H6

Multiple resources for working with small molecules, NMR, IR and mass spectra, chromatograms, etc.

JavaScript RDKit

C++-to-JavaScript port of the open source RDKit chemoinformatics toolkit.

Miscellaneous

MultiProtScale

Web app version of Expasy’s ProtScale server, which handles multiple sequences simultaneously.

CD fitter and simulator

Fit and simulate far-UV protein circular dichroism spectra.

     

 

Table 3. Free JavaScript tools not directly intended for, but with potential utility in, molecular biosciences. The listing is by no means extensive, and mainly tries to convey the reader a feel of the kinds of available tools and the potential of the technologies.

Tool

Brief Description, Possible Uses, and URL

Charts

Google Charts, uvCharts, Chartist.js

They offer very complete sets of chart types, and are very customizable. 

ChartJS, Highcharts JS, Flot

Also very complete, but here grouped together because they all provide support for older web browsers, yet deliver high-quality graphics, interactivity, and animations in modern browsers.

Smoothie Charts

Especially suited for plotting streamed data in real time. 

D3.js, n3-charts, Ember charts

D3.js has very broad applications, which allows charting in multiple formats not covered by the libraries mentioned above. Libraries like n3-charts and Ember charts make plotting through D3.js easier.

Mathematics and statistics

NumCalc.com

A very complete scientific calculator online.

LALOLib and Mlweb

Very complete libraries for mathematics in the browser, with tools for advanced matrix algebra, statistics, optimization, and machine learning. Can be used as libraries for web apps or through a complete environment (LALOLab) similar to that of stand-alone math programs, with its own plotting capabilities. 

Numeric.js

Another powerful library for mathematics in the browser, also usable through an environment similar to that of stand-alone math programs.

mljs

Library for machine learning.

JavaScript LIBSVM

C++-to-WebAssembly port of the LIBSVM support vector machine library

ConvNetJS, synaptic.js, brain, mind, DN2A

Libraries for neural networks and deep learning, covering from simpler utilities like data and function approximation and regression, to self-organizing maps, image regression and object identification, deep learning, and linguistics. Most can be trained and used online, or trained offline and used online.

jsfft, FFT.js, FFT in many languages, DSP.js, timbre.js

Libraries for Fast Fourier Transforms; together cover direct and inverse transforms, real and complex convolutions, discrete transforms, and other functions (plus, some are actually full packages for signal processing).

Math.js, Sushi, numbers.js, jstat, rift, science, glMatrix

Other math libraries, some with unique features or tailored for specific applications (for example, rift is intended for games, glMatrix, and Sushi for efficient matrix calculations)

Strings

String.js

Functions that extend those of standard JavaScript strings.

textmining and text-miner

Two similar packages for text mining. Potentially useful for mining contents in large corpuses of scientific text; Figure 1B of this article was built using such techniques. Text-miner includes lists of stopwords in four languages.

RiTa.js and nlp-compromise

Two libraries for natural language processing.
 

User interfaces

WebGazer

Eye tracking library that uses common webcams to infer eye-gaze locations of the user on the web page in real time. Could be used to facilitate molecular visualization as shown in this proof-of-concept example.

Tangle

Library to create reactive documents, i.e., which interact with the user in a contextual manner and virtually immediate response.

MathJax

Library to display formatted maths in the browser.

Emulators and programming

Linux emulators by Bellard and Macke

Two complete emulators of a linux system, the second including internet connectivity and a graphical interface. Could be used for learning linux in a safe and simple environment for example at the beginning of a tutorial course that requires linux knowledge; also for executing shell commands and scripts as well as programs written for Perl, Python, or even compiling C code, etc. on non-linux computers without the need for complex installations, as exemplified with the NESmapper Perl script.

Online programming environments

The two linux emulators listed above include C compilers and allow running Perl, Python, etc. Moreover, there are JavaScript-based web applications specifically tailored for writing, compiling, and running programs. Some notable links: site for learning and running C at http://cs-education.github.io/sys/#VM ; a Perl interpreter at
https://gfx.github.io/perl.js/ ; see also Emscripten at http://emscripten.org/

Vi emulator

A working online version of the linux vi editor, could be used to quickly process text files in non-linux computers.

3D graphics, computer vision, and augmented and virtual reality

Three.js,

A-Frame

Three.js is probably the most used library for animated 3D graphics, using WebGL. Applications are in molecular visualization and in more generic data visualization, but beyond these uses, it includes multiple numerical algorithms that could be recycled for other purposes.
A-Frame is an entity component system framework for Three.js, that makes it much easier to use in virtual and augmented reality applications, the latter especially through AR.js.

Jsfeat, tracking.js, js-aruco, AR.js, awe.js, and argon.js

Computer vision and image processing libraries which can identify and track objects or markers. Just like Three.js, they include numerical algorithms that could be used for other purposes. Put together with graphical libraries like Three.js leads directly to augmented reality web apps.

image-js

Efficient image processing and manipulation in JavaScript

Tesseract.js, Ocrad.js

Libraries for optical character recognition from images, useful for retrieving information from article figures.   

Hardware and communication

WebRTC

Not a library but a collection of standards, protocols, and APIs for real-time server-less, plugin-free communication and data exchange directly between web browsers. 
See also the example at https://apprtc.appspot.com/  which implements a web app for server-less video conferencing.

PeerJS

Browser-to-browser transfer of data, video and audio. Potential applications for concurrent visualization and collaboration.

HTML5 guitar tuner

A web app that guides guitar tuning; exemplifies how to read microphone data and analyze the signal through Fourier transforms to decompose the frequency spectrum.

annyang!

Speech recognition library to control web page with voice commands.

gyro.js

Simplified access to gyroscope and accelerometer information, expanding the information provided by the built-in Geolocation API (which only locates the user’s position based on network and/or GPS data but gives no orientation information).

GPS.js

Access to primary GPS data.

gpu.js, turbo.js,

Libraries to run calculations on Graphical Processing Units (video cards)

 

 

Other interesting resources ECMAscript, TC-39 and the history of JavaScript