As you know, after developing an animation, it's very important to work on the performance issues to make it smooth. The performance of rendering animations varies between browsers but there are some techniques like caching that can simply improve the performance. In this chapter, we will learn how to make better and smooth animations or drawings using the EaselJS caching system of
DisplayObject.
In this chapter, we will cover the following topics:
- Exploring the caching feature of EaselJS
- Understanding the cache method
- Example of using cache
- Using cache in animations
- Using cache with Bitmap
In EaselJS, when you have a shape, or even better, an instance of the DisplayObject that doesn't change frequently, it's better to use the cache function to cache it in a different Canvas element. This technique will help you use EaselJS in the drawing process to animate and render animations or drawings smoothly, as the shapes don't need to be rendered with every tick.
It is basically the main idea of using the cache method in the DisplayObject class. All you need to do is learn more about using the cache method in EaselJS. In further sections, we will go through methods, their usage, and how to create animations with caching.