YOUR GUIDE TO

When to Use a JavaScript Canvas Library or Framework

And when to use an HTML DOM Library or Framework

Dr Abstract
9 min readJul 25, 2020

--

Examples of good uses for the canvas!

In this guide we will explore when we should use a Canvas framework as opposed to traditional HTML, CSS and JS or a DOM framework.

Both libraries and frameworks provide pre-built code to help you make things faster and easier. The general difference is with a library you pick the parts you want and use them. With a framework you plug into a system that does things for you. They are quite similar and lines blur so we will use the term framework for simplicity.

Brief History of HTML, CSS, JavaScript (DOM) and Interactive Media

Traditional HTML, CSS and JavaScript have been around since the nineties and the main focus has been to make Web documents for the Browser. Other environments such as Macromedia/Adobe Director and Flash were used for Interactive Media.

Interactive Media (initially, multimedia) could be considered to encompass Web design and development but to keep things clear, let us say Interactive Media tends towards interactivity beyond navigation. This includes making things, doing things, playing things. Web sites tend towards interactivity to navigate to things or to show things. Communication sits in the middle and is handled by both. This is a generalization.

Interactive Media tends towards Creation, Web sites tend towards Consumption

The Rise of the Canvas

With the launch of HTML 5, roughly ten years ago, JavaScript was split into a core language and a set of Web APIs (Application Program Interfaces). A major API is the DOM. It is important to note that language of JavaScript is independent of HTML tags. Another Web API is the Canvas API.

The canvas tag is an HTML tag and therefore part of the DOM. But we will consider it separate from traditional DOM because it is coded differently.

The canvas tag shows a Bitmap and the Canvas API holds the classes and code that let you make things on the canvas tag by dynamically changing the Bitmap with…

--

--

Dr Abstract

Inventor, Founder of ZIM JavaScript Canvas Framework and Nodism, Professor of Interactive Media at Sheridan, Canadian New Media Awards Programmer and Educator