Frame rate in Butter

← All Butter documentation

Butter will automatically select a default frame rate for your sketch:

• If your component does not depend on any incremental frame state, the default rate is 60fps.
• If your component updates state every frame, then Butter cannot drop frames during playback without affecting the visuals, so the default rate is 30fps to make it more likely it will keep up.

You can always manually set the frameRate(rate) to some other rate, e.g. if you intentionally want a low frame rate to imitate animating on twos or threes. Even subdivisions of the default 60 will work best.

There are a few differences in how frames work in Butter compared with a regular p5.js sketch.

• Calling frameRate() will always return the target frame rate rather than the current rate achieved by the browser.
• When your component does not depend on incremental frame state, frameCount may skip frames. It will always represent the current frame in the component's timeline, but Butter may drop frames in between to stay in sync with sound.