Skip to content

GitLab

T
tangled
Commit 8545ae68 authored by Demetrios Papadopoulos's avatar Demetrios Papadopoulos Committed by Commit Bot
Browse files
Options

Settings WebUI: Move Settings subpages to lazy_load.html. 

Move Settings subpages currently residing in the main module
to the lazy module. This change further reduces the amount of code
(both JS and HTML) that is part of the main module.

Previously it was assumed that only elements in the "Advanced" section
resided under the lazy_load.html module. With this change, subpages
that are part of the basic module are also moved to lazy_load.html.

The change in main_page_behavior.js is necessary to ensure that subpages
are force loaded before we attempt to display them.

Numbers from Linux build (before -> after):
vulcanized.html           298K -> 239K, -59K, -19.8%
crisper.js                346K -> 285K, -61K, -17.6%
lazy_load.vulcanized.html 149K -> 207K, +58K, +38.9%
lazy_load.crisper.js      179K -> 240K, +61K, +34.1%

In this CL intentionally not touching any ChromeOS specific subpages
(will address in follow up CL).

Bug: 1026064
Change-Id: I3b1ef541ce9d6e3a267e0b2434154c632b0b1a3e
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1922295
Commit-Queue: Demetrios Papadopoulos <dpapad@chromium.org>
Reviewed-by: default avatarDan Beam <dbeam@chromium.org>
Cr-Commit-Position: refs/heads/master@{#719484}
parent 4289f938
Hide whitespace changes
Inline Side-by-side
Showing with 52 additions and 24 deletions
chrome/browser/resources/settings/appearance_page/appearance_page.html
View file @ 8545ae68
...@@ -15,7 +15,6 @@ ...@@ -15,7 +15,6 @@
<link rel="import" href="../settings_page/settings_subpage.html"> <link rel="import" href="../settings_page/settings_subpage.html">
<link rel="import" href="../settings_shared_css.html"> <link rel="import" href="../settings_shared_css.html">
<link rel="import" href="../settings_vars_css.html"> <link rel="import" href="../settings_vars_css.html">
<link rel="import" href="appearance_fonts_page.html">
<link rel="import" href="home_url_input.html"> <link rel="import" href="home_url_input.html">
<if expr="chromeos"> <if expr="chromeos">
......
chrome/browser/resources/settings/autofill_page/autofill_page.html
View file @ 8545ae68
...@@ -3,9 +3,6 @@ ...@@ -3,9 +3,6 @@
<link rel="import" href="chrome://resources/cr_elements/cr_link_row/cr_link_row.html"> <link rel="import" href="chrome://resources/cr_elements/cr_link_row/cr_link_row.html">
<link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html"> <link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html">
<link rel="import" href="chrome://resources/html/cr.html"> <link rel="import" href="chrome://resources/html/cr.html">
<link rel="import" href="autofill_section.html">
<link rel="import" href="passwords_section.html">
<link rel="import" href="payments_section.html">
<link rel="import" href="../prefs/prefs.html"> <link rel="import" href="../prefs/prefs.html">
<link rel="import" href="../prefs/prefs_behavior.html"> <link rel="import" href="../prefs/prefs_behavior.html">
<link rel="import" href="../open_window_proxy.html"> <link rel="import" href="../open_window_proxy.html">
...@@ -13,6 +10,7 @@ ...@@ -13,6 +10,7 @@
<link rel="import" href="../settings_page/settings_animated_pages.html"> <link rel="import" href="../settings_page/settings_animated_pages.html">
<link rel="import" href="../settings_page/settings_subpage.html"> <link rel="import" href="../settings_page/settings_subpage.html">
<link rel="import" href="../settings_shared_css.html"> <link rel="import" href="../settings_shared_css.html">
<link rel="import" href="./password_manager_proxy.html">
<dom-module id="settings-autofill-page"> <dom-module id="settings-autofill-page">
<template> <template>
......
chrome/browser/resources/settings/lazy_load.html
View file @ 8545ae68
<html> <html>
<head></head> <head></head>
<body> <body>
<!-- Subpages -->
<link rel="import" href="appearance_page/appearance_fonts_page.html">
<link rel="import" href="autofill_page/autofill_section.html">
<link rel="import" href="autofill_page/passwords_section.html">
<link rel="import" href="autofill_page/payments_section.html">
<link rel="import" href="search_engines_page/search_engines_page.html">
<if expr="not chromeos">
<link rel="import" href="people_page/manage_profile.html">
<link rel="import" href="people_page/sync_account_control.html">
</if>
<!-- Sections -->
<link rel="import" href="a11y_page/a11y_page.html"> <link rel="import" href="a11y_page/a11y_page.html">
<link rel="import" href="downloads_page/downloads_page.html"> <link rel="import" href="downloads_page/downloads_page.html">
<link rel="import" href="languages_page/languages_page.html"> <link rel="import" href="languages_page/languages_page.html">
...@@ -8,12 +21,12 @@ ...@@ -8,12 +21,12 @@
<link rel="import" href="privacy_page/privacy_page.html"> <link rel="import" href="privacy_page/privacy_page.html">
<link rel="import" href="reset_page/reset_page.html"> <link rel="import" href="reset_page/reset_page.html">
<if expr="chromeos"> <if expr="chromeos">
<link rel="import" href="date_time_page/date_time_page.html"> <link rel="import" href="date_time_page/date_time_page.html">
</if> </if>
<if expr="not chromeos"> <if expr="not chromeos">
<link rel="import" href="system_page/system_page.html"> <link rel="import" href="system_page/system_page.html">
</if> </if>
</body> </body>
</html> </html>
chrome/browser/resources/settings/people_page/people_page.html
View file @ 8545ae68
...@@ -40,9 +40,7 @@ ...@@ -40,9 +40,7 @@
</if> </if>
<if expr="not chromeos"> <if expr="not chromeos">
<link rel="import" href="chrome://resources/cr_elements/cr_toast/cr_toast.html"> <link rel="import" href="chrome://resources/cr_elements/cr_toast/cr_toast.html">
<link rel="import" href="sync_account_control.html">
<link rel="import" href="import_data_dialog.html"> <link rel="import" href="import_data_dialog.html">
<link rel="import" href="manage_profile.html">
</if> </if>
<dom-module id="settings-people-page"> <dom-module id="settings-people-page">
......
chrome/browser/resources/settings/search_page/search_page.html
View file @ 8545ae68
...@@ -11,7 +11,6 @@ ...@@ -11,7 +11,6 @@
<link rel="import" href="../icons.html"> <link rel="import" href="../icons.html">
<link rel="import" href="../i18n_setup.html"> <link rel="import" href="../i18n_setup.html">
<link rel="import" href="../route.html"> <link rel="import" href="../route.html">
<link rel="import" href="../search_engines_page/search_engines_page.html">
<link rel="import" href="../search_engines_page/search_engines_browser_proxy.html"> <link rel="import" href="../search_engines_page/search_engines_browser_proxy.html">
<link rel="import" href="../settings_page/settings_animated_pages.html"> <link rel="import" href="../settings_page/settings_animated_pages.html">
<link rel="import" href="../settings_page/settings_subpage.html"> <link rel="import" href="../settings_page/settings_subpage.html">
......
chrome/browser/resources/settings/settings_page/main_page_behavior.js
View file @ 8545ae68
...@@ -193,12 +193,22 @@ cr.define('settings', function() { ...@@ -193,12 +193,22 @@ cr.define('settings', function() {
this.scroller.scrollTop = 0; this.scroller.scrollTop = 0;
this.classList.add('showing-subpage'); this.classList.add('showing-subpage');
this.fire('subpage-expand'); this.fire('subpage-expand');
this.ensureSectionForRoute_(route).then(section => {
section.classList.add('expanded');
// Fire event used by a11y tests only.
this.fire('settings-section-expanded');
this.fire('show-container'); // Explicitly load the lazy_load.html module, since all subpages reside in
// the lazy loaded module.
// TODO(dpapad): On chrome://os-settings the lazy_load.html file resides
// at a different path. Remove conditional logic once this file is not
// shared between chrome://settings and chrome://os-settings.
const lazyLoadPathPrefix =
window.origin === 'chrome://settings' ? '' : '/chromeos';
Polymer.importHref(`${lazyLoadPathPrefix}/lazy_load.html`, () => {
this.ensureSectionForRoute_(route).then(section => {
section.classList.add('expanded');
// Fire event used by a11y tests only.
this.fire('settings-section-expanded');
this.fire('show-container');
});
}); });
}, },
......
chrome/test/data/webui/settings/autofill_page_test.js
View file @ 8545ae68
...@@ -121,8 +121,9 @@ cr.define('settings_autofill_page', function() { ...@@ -121,8 +121,9 @@ cr.define('settings_autofill_page', function() {
let paymentsManager; let paymentsManager;
setup(function() { setup(async function() {
PolymerTest.clearBody(); PolymerTest.clearBody();
await settings.forceLazyLoaded();
// Override the PasswordManagerImpl for testing. // Override the PasswordManagerImpl for testing.
passwordManager = new TestPasswordManagerProxy(); passwordManager = new TestPasswordManagerProxy();
......
chrome/test/data/webui/settings/cr_settings_browsertest.js
View file @ 8545ae68
...@@ -263,12 +263,12 @@ CrSettingsAutofillPageTest.prototype = { ...@@ -263,12 +263,12 @@ CrSettingsAutofillPageTest.prototype = {
extraLibraries: CrSettingsBrowserTest.prototype.extraLibraries.concat([ extraLibraries: CrSettingsBrowserTest.prototype.extraLibraries.concat([
'../fake_chrome_event.js', '../fake_chrome_event.js',
'../test_browser_proxy.js', '../test_browser_proxy.js',
'autofill_page_test.js',
'ensure_lazy_loaded.js', 'ensure_lazy_loaded.js',
'fake_settings_private.js', 'fake_settings_private.js',
'passwords_and_autofill_fake_data.js', 'passwords_and_autofill_fake_data.js',
'test_open_window_proxy.js', 'test_open_window_proxy.js',
'test_password_manager_proxy.js', 'test_password_manager_proxy.js',
'autofill_page_test.js',
]), ]),
}; };
......
chrome/test/data/webui/settings/ensure_lazy_loaded.js
View file @ 8545ae68
...@@ -10,17 +10,27 @@ cr.define('settings', function() { ...@@ -10,17 +10,27 @@ cr.define('settings', function() {
// (aka vulcanize). // (aka vulcanize).
if (location.href == location.origin + '/') { if (location.href == location.origin + '/') {
suiteSetup(function() { suiteSetup(function() {
return new Promise(function(resolve, reject) { return forceLazyLoaded(pathPrefix);
// This URL needs to match the URL passed to <settings-idle-load> from
// <settings-basic-page>.
const path = (pathPrefix || '') + '/lazy_load.html';
Polymer.Base.importHref(path, resolve, reject, true);
});
}); });
} }
} }
/**
* @param {string=} pathPrefix Prefix for the path to lazy_load.html
* @return {!Promise} Forces the lazy_load.html module to be loaded. No-op if
* it has been loaded already.
*/
function forceLazyLoaded(pathPrefix) {
return new Promise(function(resolve, reject) {
// This URL needs to match the location of lazy_load.html (differs across
// chrome://settings and chrome://os-settings).
Polymer.Base.importHref(
`${pathPrefix || ''}/lazy_load.html`, resolve, reject, true);
});
}
return { return {
ensureLazyLoaded: ensureLazyLoaded, ensureLazyLoaded: ensureLazyLoaded,
forceLazyLoaded: forceLazyLoaded,
}; };
}); });
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment