1.1 What Is Three.js?

Hello, and welcome to 3D in the browser with three.js. A tuts+ course with me, Stuart Memo. In this course we'll be learning about the popular client side JavaScript library, three.js. Three.js's aim is to help developers create 3D graphics in the browser by simplifying the more complicated WebGL API. It provides a nice API and some developer friendly concepts to help you create shapes, lights, cameras and everything else you need for a 3D world. So you heard me mention WebGL, let's start with that and see how it fits into what we'll do. WebGL is a JavaScript API for rendering 3D computer graphics in a web browser without the use of plug-ins. And more importantly, WebGL is integrated completely into the web standards of the browser, allowing GPU accelerated usage of physics and image processing and effects as part of the web page canvas. This is great news as it means that the browser will offload any drawing calculations to the graphics processor unit, meaning your code will run a lot smoother. So, sounds great. Why do we need to bother with three? Well, take a look at this code here. This is the amount of code needed to create a cube with a texture in WebGL, hundreds of lines. Now look at the amount of code it takes to do the same thing in three. Three removes all that complexity and gives us a much simpler API to work with. When we write code that uses three, we're still using WebGL, but three's doing the donkey work, making those more complicated calls for us. Makes sense, okay let's get started.