/dog-expert

Recognize dog breed from image uploaded by user

Primary LanguageTypeScript

Dog expert

Coverage status

Takes an image uploaded by the user and recognizes its breed by using a pre-trained TensorFlow.js model MobileNet. Then displays images of dogs of the same breed (fetched from Dog API) in an infinitely scrollable gallery.

You can see the demo here

Dog expert

Available scripts

To start the project, simply run:

npm install   // first time only
npm run start

To create and then serve your own build:

npm run build
npx serve dist

Some technical details

  • Project is written in TypeScript, this is actually my first time using it
  • To reduce the load on the main thread, all image classification happens inside a separate Web Worker. For easier usage, Web Worker is loaded with comlink-loader
  • The MobileNet model requires an image to be passed to its classify method. If the browser supports OffscreenCanvas, it is used to create an image inside a Web Worker. If not, a regular canvas is created on the main thread, and then ImageData is passed to the Web Worker for classification.
  • Infinite scroll implemented with IntersectionObserver

Credits

Started this as a test assignment from this boilerplate