One of the things that we love about writing code in CodePen is the automatically updating preview. You don’t do anything but type and the preview is automatically updated. That’s what you want the vast majority of the time. But there are times when you’d like to prevent that behavior and only update when you explicitly choose. The vast majority of those times is when you are writing fairly complex JavaScript.

We have a new feature that has got you covered!

Perhaps you’re JavaScript has a loop in it that takes a little bit to run. Perhaps you do a good bit of DOM manipulation to set up your demo. You may not want your JavaScript to re-execute every time you press a key.

To turn that off, open the JavaScript settings and UN-check the Auto Run? checkbox.

When that setting is un-checked, you’ll see a Run button exposed that you need to explicitly press in order to re-run the JavaScript.

Press it, and your JavaScript will run! The Pen will not update otherwise as you type in the JavaScript editor. The Pen will continue to auto-update as you change HTML or CSS.

This is a Pen-by-Pen choice and your choice will save with that Pen. If you have a strong preference for this one way or the other, you can go under the Your Settings area and set it there. All new Pens you create will honor that preference by default.

Enjoy!