Draw only symbols in bounds

Consider this scenario... A user draws a long polyline on a map, say across the whole United States. They add a decorator to the line displaying a marker every 100 pixels. If the user zooms close into the line, thousands of symbols are drawn that are not even visible on the map. This was causing the browser to crash in the app that I'm working on. I noticed that the DOM had thousands of marker DOM nodes in it when zooming in.

With my changes, it seems to increase performance a lot. We keep the cache, but only add the symbols that are in bounds on the map to the DOM. Now instead of having close to 10,000 symbols in the DOM when zoomed in on a long line, I have 10 in my case.