jQuery UI Initialization Issues

Every once in a while when using jQuery UI I notice that my widget is not being initialized smoothly. For example, when using the menu widget I might see the list items behind the menu briefly. Then the page jumps around and it is a generally unpleasant experience for the user. Who likes it when your jQuery widgets are jumpy and cause the page to feel like one of those old 'punch the monkey' banner ads?

This usually means I have done something like this:

require(['jquery', 'jquery-ui/menu'], function($, menu) { $("#navmenu").menu(); });

Instead of wrapping the initialization in a function as I should:

require(['jquery', 'jquery-ui/menu'], function($, menu) { $(function() { $("#navmenu").menu(); }); });