Computer vision has been a hot topic in recent years, enabling countless great applications. With the effort from some dedicated developers in the world, creating an application utilizing computer vision is no longer rocket science. In fact, you can build many of the application in a few lines of JavaScript code. In this article, I will introduce you to some of them.

1. TensorFlow.js

Being one of the largest machine learning frameworks, TensorFlow also allows the creation of Node.js and front-end JavaScript applications with Tensorflow.js. Below is one of their demos matching poses with a collection of images. TensorFlow also has a playground allowing us to visualize better artificial neural networks, which can be great for educational purposes.

fzXRDjBio2OIxVNIHI2Njxb9sg6x9rVQRAph
A Move Mirror Demo from Tensorflow.js

2. Amazon Rekognition

Amazon Rekognition is a powerful cloud-based tool. But they also provide SDKs for JavaScript in browsers which can be found here. Below is an image illustrating how detailed their face detection can be.

0pIcn86SNFaM5cbA5CXboENRyfMtX0ayQ3rb
Facial Feature Detection with Amazon Rekognition API

3. OpenCV.js

Being one of the oldest computer vision frameworks out there, OpenCV has served developers in computer vision for a very long time. They also have a JavaScript version allowing developers to implement those features onto a website.

axCPVu-3ItA12kmt4OLraf0WgqxzZ-BmmUfr
Example Face Detection with OpenCV, Image from DZone

4. tracking.js

If you are only looking to build a quick face detection app, such as a web version of the snapchat filters, you should take a look at tracking.js. This framework allows integration of face recognition with JavaScript with a fairly simple setup. I have also wrote a guide on this framework dropping a leprechaun hat onto faces for St. Patrick’s Day.

ntEODKKA39CkXs9Q8Fcb8uMBEaVC0OZZZpot
tracking.js face detection example

5. WebGazer.js

Whether you are trying to perform user experience studies or creating new interactive systems for your game or websites, WebGazer.js can be a great place to start. This powerful framework allows our apps to know where the person is looking at with camera inputs.

ofDdoti6XYIdLDUNfnDA4X54j8AHvNXeOpJY
WebGazer.js gaze tracking example

6. three.ar.js

Another framework from Google, three.ar.js extends the functionalities of ARCore onto front-end JavaScript. It enables us to integrate surface and object detection into browsers, which is the perfect tool for an AR game.

2jPTttH19OZg9eeSQ7YXiFsQ-Xq8E2bqmk96
three.ar.js demo

In the End…

I am passionate about learning new technology and sharing it with the community. If there is anything you wish to read in particular, please let me know. Below are my previous articles related to this subject. Stay tuned and have fun engineering!