summaryrefslogtreecommitdiff
path: root/docs/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html
diff options
context:
space:
mode:
Diffstat (limited to 'docs/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html')
-rw-r--r--docs/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html133
1 files changed, 133 insertions, 0 deletions
diff --git a/docs/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html b/docs/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html
new file mode 100644
index 0000000..885c7b5
--- /dev/null
+++ b/docs/posts/2021-06-26-Cheminformatics-On-The-Web-2021.html
@@ -0,0 +1,133 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+
+ <link rel="stylesheet" href="/assets/main.css" />
+ <link rel="stylesheet" href="/assets/sakura.css" />
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Hey - Post</title>
+ <meta name="og:site_name" content="Navan Chauhan" />
+ <link rel="canonical" href="https://navanchauhan.github.io/" />
+ <meta name="twitter:url" content="https://navanchauhan.github.io/" />
+ <meta name="og:url" content="https://navanchauhan.github.io/" />
+ <meta name="twitter:title" content="Hey" />
+ <meta name="og:title" content="Hey" />
+ <meta name="description" content="Welcome to my personal fragment of the internet." />
+ <meta name="twitter:description" content="Welcome to my personal fragment of the internet. Majority of the posts should be complete." />
+ <meta name="og:description" content="Welcome to my personal fragment of the internet." />
+ <meta name="twitter:card" content="summary" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+ <link rel="shortcut icon" href="/images/favicon.png" type="image/png" />
+ <link rel="alternate" href="/feed.rss" type="application/rss+xml" title="Subscribe to Navan Chauhan" />
+ <meta name="twitter:image" content="https://navanchauhan.github.io/images/logo.png" />
+ <meta name="og:image" content="https://navanchauhan.github.io/images/logo.png" />
+ <link rel="manifest" href="manifest.json" />
+ <meta name="google-site-verification" content="LVeSZxz-QskhbEjHxOi7-BM5dDxTg53x2TwrjFxfL0k" />
+ <script async src="//gc.zgo.at/count.js" data-goatcounter="https://navanchauhan.goatcounter.com/count"></script>
+
+</head>
+<body>
+ <nav style="display: block;">
+|
+<a href="/">home</a> |
+<a href="/about/">about/links</a> |
+<a href="/posts/">posts</a> |
+<a href="/publications/">publications</a> |
+<a href="/repo/">iOS repo</a> |
+<a href="/feed.rss">RSS Feed</a> |
+</nav>
+
+<main>
+ <h1>Cheminformatics on the Web (2021)</h1>
+
+<p>Here, I have compiled a list of some tools and possible solutions.
+The web is a nice platform, it is available anywhere and just requires an internet connection.
+I, personally like static websites which don't require a server side application and can be hosted on platforms like GitHub Pages.
+Or, just open the HTML file and run it in your browser.
+No data is required to be sent to any server and your device's computational power is used.
+Even our phones have a lot of computational power now, which allows the user to run tasks on the go without needing to worry about managing dependencies.
+WebAssembly (Wasm) has made running code written for other platfroms on the web relativevly easier.
+Combine Wasm with some pure JavaScript libraries, and you get a platform to quickly amp up your speed in some common tasks.</p>
+
+<h2>RDKit</h2>
+
+<p>RDKit bundles a minimal JavaScript Wrapper in their core RDKit suite.
+This is perfect for generating 2D Figures (HTML5 Canva/SVGs), Cannonical SMILES, Descriptors e.t.c</p>
+
+<h3>Substructure Matching</h3>
+
+<p>This can be used to flag undesirable functional groups in a given compound.
+Create a simple key:value pair of name:SMARTS and use it to highlight substructure matches.
+Thus, something like PostEra's Medicinal Chemistry Alert can be done with RDKit-JS alone.</p>
+
+<p><img src="/assets/posts/cheminformatics-web/postera-demo.png" alt="PostEra Demo" /></p>
+
+<h3>Computing Properties</h3>
+
+<p>This is useful to calculate basic properties of a given compound.</p>
+
+<p><img src="/assets/posts/cheminformatics-web/rdkit-demo.png" alt="RDKit-JS Demo" /></p>
+
+<h2>Webina - Molecular Docking</h2>
+
+<p>Webina is a JavaScript/Wasm library that runs AutoDock Vina, which can enable you to run Molecular Docking straight in the browser itself.</p>
+
+<p><img src="/assets/posts/cheminformatics-web/webina-demo.png" alt="Webina Demo" /></p>
+
+<p>Obviously, it takes a few hits in the time to complete the docking because the code is transpiled from C++ to Wasm.
+But, the only major drawback (for now) is that it uses SharedArrayBuffer.
+Due to Spectre, this feature was disabled on all browsers.
+Currently, only Chromium-based and Firefox browsers have reimplemented and renabled it.
+Hopefully, soon this will be again supported by all major browsers.</p>
+
+<h2>Machine Learning</h2>
+
+<p>Frameworks have now evolved enough to allow exporting models to be able to run them through JavaScript/Wasm backend.
+An example task can be <strong>NER</strong> or Named-entity Recognition.
+It can be used to extract compounds or diseases from a large blob of text and then matched with external refferences.
+Another example is target-prediction right in the browser: <a rel="noopener" target="_blank" href="http://chembl.blogspot.com/2021/03/target-predictions-in-browser-with.html">CHEMBL - Target Prediction in Browser</a></p>
+
+<p>CHEMBL Group is first training the model using PyTorch (A Python ML Library), then converting it to the ONNX runtime.
+A model like this can be directly implemented in Tensorflow, and then exported to be able to run with TensorFlow.js</p>
+
+<h2>Cheminfo-to-web</h2>
+
+<p>The project aims to port chemoinformatics libraries into JavaScript via Emscripten.
+They have ported InChI, Indigo, OpenBabel, and OpenMD</p>
+
+<h3>Kekule.js</h3>
+
+<p>It is written by @partridgejiang, who is behind the Cheminfo-to-web project</p>
+
+<blockquote>
+ <p>It is molecule-centric, focusing on providing the ability to represent, draw, edit, compare and search molecule structures on web browsers.</p>
+</blockquote>
+
+<h2>Browser Extensions</h2>
+
+<p>The previous machine learning examples can be packaged as browser-extensions to perform tasks on the article you are reading.
+With iOS 15 bringing WebExtensions to iOS/iPadOS, the same browser extension source code can be now used on Desktop and Mobile Phones.
+You can quickly create an extenison to convert PDB codes into links to RCSB, highlight SMILES, highlight output of NER models, e.t.c</p>
+
+<h2>Conclusion</h2>
+
+<p>I have not even touched all the bases of cheminformatics for the web here.
+There is still a lot more to unpack.
+Hopefully, this encourages you to explore the world of cheminformatics on the web.</p>
+
+<h2>Further Reading</h2>
+
+<p><a rel="noopener" target="_blank" href="https://blueobelisk.github.io/greasemonkey.html">Blueobelisk Userscripts</a></p>
+
+<p><a rel="noopener" target="_blank" href="https://depth-first.com/articles/2019/05/01/javascript-for-cheminformatics-part-2/">JavaScript for Cheminformatics</a></p>
+
+<p><a rel="noopener" target="_blank" href="https://unpkg.com/@rdkit/rdkit@2021.3.3/Code/MinimalLib/dist/GettingStartedInJS.html">Getting Started with RDKit-JS</a></p>
+
+</main>
+
+
+<script src="assets/manup.min.js"></script>
+<script src="/pwabuilder-sw-register.js"></script>
+</body>
+</html> \ No newline at end of file