diff --git a/extension.json b/extension.json
index b2cc0fe7..ef13283a 100644
--- a/extension.json
+++ b/extension.json
@@ -232,7 +232,6 @@
 			"scripts": "js/ext.uls.interface.js",
 			"styles": "css/ext.uls.interface.less",
 			"dependencies": [
-				"ext.uls.common",
 				"mediawiki.jqueryMsg",
 				"mediawiki.storage",
 				"mediawiki.user",
@@ -279,6 +278,7 @@
 				"ext.uls.languagenames",
 				"ext.uls.messages",
 				"jquery.uls",
+				"ext.uls.webfonts",
 				"jquery.uls.grid",
 				"mediawiki.util"
 			],
@@ -322,7 +322,6 @@
 			"targets": [ "desktop", "mobile" ],
 			"scripts": "js/ext.uls.webfonts.js",
 			"dependencies": [
-				"ext.uls.common",
 				"ext.uls.preferences",
 				"jquery.client"
 			],
diff --git a/resources/js/ext.uls.common.js b/resources/js/ext.uls.common.js
index be76a791..b0163b86 100644
--- a/resources/js/ext.uls.common.js
+++ b/resources/js/ext.uls.common.js
@@ -32,7 +32,6 @@
 
 	mw.uls = mw.uls || {};
 	mw.uls.previousLanguagesStorageKey = 'uls-previous-languages';
-	mw.uls.languageSettingsModules = [ 'ext.uls.displaysettings' ];
 
 	/**
 	 * Change the language of wiki using API or set cookie and reload the page
diff --git a/resources/js/ext.uls.displaysettings.js b/resources/js/ext.uls.displaysettings.js
index 9a1feab8..c68875a0 100644
--- a/resources/js/ext.uls.displaysettings.js
+++ b/resources/js/ext.uls.displaysettings.js
@@ -116,12 +116,37 @@
 
 		constructor: DisplaySettings,
 
+		/**
+		 * Loads the webfonts module sets the `webfonts` property when its safe to do so
+		 */
+		setupWebFonts: function () {
+			var d = $.Deferred();
+			mw.loader.using( [ 'ext.uls.webfonts.fonts' ] ).then( function () {
+				if ( this.isWebFontsEnabled ) {
+					mw.webfonts.setup();
+				}
+
+				// Allow the webfonts library to finish loading (hack)
+				setTimeout( function () {
+					this.$webfonts = $( document.body ).data( 'webfonts' );
+					d.resolve();
+				}.bind( this ), 1 );
+			}.bind( this ) );
+			return d;
+		},
 		/**
 		 * Render the module into a given target
 		 */
 		render: function () {
+			this.setupWebFonts().then( function () {
+				this.renderAfterDependenciesLoaded();
+			}.bind( this ) );
+		},
+		/**
+		 * Render the module into a given target after all
+		 */
+		renderAfterDependenciesLoaded: function () {
 			this.$parent.$settingsPanel.empty();
-			this.$webfonts = $( document.body ).data( 'webfonts' );
 			this.$parent.$settingsPanel.append( this.$template );
 			this.prepareLanguages();
 			this.prepareUIFonts();
@@ -546,25 +571,18 @@
 				displaySettings.markDirty();
 
 				if ( this.checked ) {
-					mw.loader.using( 'ext.uls.webfonts.fonts', function () {
-						mw.webfonts.setup();
+					displaySettings.setupWebFonts().then( function () {
+						mw.webfonts.preferences.enable();
 
-						// Allow the webfonts library to finish loading
-						setTimeout( function () {
-							displaySettings.$webfonts = $( document.body ).data( 'webfonts' );
+						displaySettings.prepareContentFonts();
+						displaySettings.prepareUIFonts();
 
-							mw.webfonts.preferences.enable();
+						displaySettings.i18n();
+						// eslint-disable-next-line no-jquery/no-sizzle
+						displaySettings.$webfonts.apply( $uiFontSelector.find( 'option:selected' ) );
+						displaySettings.$webfonts.refresh();
 
-							displaySettings.prepareContentFonts();
-							displaySettings.prepareUIFonts();
-
-							displaySettings.i18n();
-							// eslint-disable-next-line no-jquery/no-sizzle
-							displaySettings.$webfonts.apply( $uiFontSelector.find( 'option:selected' ) );
-							displaySettings.$webfonts.refresh();
-
-							$fontSelectors.removeClass( 'hide' );
-						}, 1 );
+						$fontSelectors.removeClass( 'hide' );
 					} );
 				} else {
 					$fontSelectors.addClass( 'hide' );
diff --git a/resources/js/ext.uls.ime.js b/resources/js/ext.uls.ime.js
index e0f50283..ec260d9a 100644
--- a/resources/js/ext.uls.ime.js
+++ b/resources/js/ext.uls.ime.js
@@ -20,7 +20,8 @@
 ( function () {
 	'use strict';
 
-	var mwImeRulesPath, inputSelector, inputPreferences, ulsIMEPreferences, customHelpLink;
+	var mwImeRulesPath, inputSelector, inputPreferences, ulsIMEPreferences, customHelpLink,
+		languageSettingsModules = [ 'ext.uls.displaysettings' ];
 
 	mwImeRulesPath = mw.config.get( 'wgExtensionAssetsPath' ) +
 		'/UniversalLanguageSelector/lib/jquery.ime/';
@@ -145,7 +146,7 @@
 
 		// Apparently we depend on some styles which are loaded with
 		// these modules. This needs refactoring.
-		mw.loader.using( mw.uls.languageSettingsModules, function () {
+		mw.loader.using( languageSettingsModules, function () {
 			$moreSettingsLink.languagesettings( {
 				defaultModule: 'input',
 				onClose: function () {
diff --git a/resources/js/ext.uls.interface.js b/resources/js/ext.uls.interface.js
index 9004b4d5..b95e4205 100644
--- a/resources/js/ext.uls.interface.js
+++ b/resources/js/ext.uls.interface.js
@@ -19,6 +19,7 @@
 
 ( function () {
 	'use strict';
+	var languageSettingsModules = [ 'ext.uls.displaysettings' ];
 
 	/**
 	 * Construct the display settings link
@@ -195,7 +196,9 @@
 
 						event.preventDefault();
 						deferred.done( function () {
-							mw.uls.changeLanguage( event.target.lang );
+							mw.loader.using( [ 'ext.uls.common' ] ).then( function () {
+								mw.uls.changeLanguage( event.target.lang );
+							} );
 						} );
 
 						mw.hook( 'mw.uls.language.revert' ).fire( deferred );
@@ -312,7 +315,7 @@
 					}
 				};
 
-				mw.loader.using( mw.uls.languageSettingsModules, function () {
+				mw.loader.using( languageSettingsModules, function () {
 					$ulsTrigger.languagesettings( languageSettingsOptions ).trigger( 'click' );
 				} );
 
@@ -329,7 +332,7 @@
 						mw.hook( 'mw.uls.settings.open' ).fire( eventParams && eventParams.source || 'personal' );
 					}
 				} else {
-					mw.loader.using( mw.uls.languageSettingsModules, function () {
+					mw.loader.using( languageSettingsModules, function () {
 						$ulsTrigger.languagesettings();
 
 						$ulsTrigger.trigger( 'click', eventParams );
@@ -354,7 +357,7 @@
 							},
 							onReady: function () {
 								var uls = this;
-								mw.loader.using( mw.uls.languageSettingsModules, function () {
+								mw.loader.using( languageSettingsModules, function () {
 									addDisplaySettings( uls );
 									addInputSettings( uls );
 								} );
@@ -427,7 +430,9 @@
 			mw.storage.set( 'uls-previous-language-code', currentLanguage );
 			mw.storage.set( 'uls-previous-language-autonym', currentAutonym );
 			// Store this language in a list of frequently used languages
-			mw.uls.addPreviousLanguage( currentLanguage );
+			mw.loader.using( [ 'ext.uls.common' ] ).then( function () {
+				mw.uls.addPreviousLanguage( currentLanguage );
+			} );
 		}
 	}
 
diff --git a/resources/js/ext.uls.webfonts.js b/resources/js/ext.uls.webfonts.js
index cf942772..e9189a46 100644
--- a/resources/js/ext.uls.webfonts.js
+++ b/resources/js/ext.uls.webfonts.js
@@ -135,7 +135,10 @@
 		mw.webfonts.preferences.load();
 
 		if ( mw.webfonts.preferences.isEnabled() ) {
-			mw.loader.using( 'ext.uls.webfonts.fonts', mw.webfonts.setup );
+			// Queue to next idle period to optimize loading.
+			mw.requestIdleCallback( function () {
+				mw.loader.using( 'ext.uls.webfonts.fonts' ).then( mw.webfonts.setup );
+			} );
 		}
 	} );