Optimisations (#1477)

build.mjs

@@ -143,7 +143,7 @@ async function makeHTML(name, stylePath, body = '') {
 <meta charset=utf-8>
 <title>New Tab</title>
 <script src=${name}.js defer></script>
-<style>${css}</style>
+<style id=t>${css}</style>
 ${body}`;
 
   await fs.writeFile(path.join(dir, 'dist', `${name}.html`), template);
@@ -154,7 +154,7 @@ await makeHTML(
   'src/css/newtab.xcss',
   // Theme loader as inline script for earliest possible execution start time +
   // use localStorage for synchronous data retrieval to prevent FOUC
-  '<script id=t>let s=document.createElement("style");s.textContent=localStorage.t;t.after(s)</script>',
+  '<script>t.textContent+=localStorage.t</script>',
 );
 await makeHTML('settings', 'src/css/settings.xcss');
 

manifest.config.js

@@ -46,7 +46,7 @@ module.exports = {
   content_security_policy: [
     "default-src 'none'",
     // Hash of inline theme loader script embedded in the HTML
-    "script-src-elem 'self' 'sha256-tTEM8/3BDl1ZYg+4egLH8ztU+VEjQjhJbhCawNk+L2Q='",
+    "script-src-elem 'self' 'sha256-8N8wUVajC/wkiqNS1NQFp9Ec/Yk+LfiZ5zE4aZwH9E8='",
     // App styles are embedded in the HTML for fastest load performance
     "style-src-elem 'unsafe-inline'",
     'img-src chrome://favicon',

src/components/Search.ts

@@ -67,7 +67,7 @@ export const Search = (): SearchComponent => {
     const sectionOrder = userSettings.o || DEFAULT_SECTION_ORDER;
 
     sectionOrder.forEach((name) => {
-      section[name] = append(SearchResult(name, []), root);
+      section[name] = append(SearchResult(name), root);
     });
 
     const openTabs = section[DEFAULT_SECTION_ORDER[0]];

src/components/SearchResult.ts

@@ -20,7 +20,7 @@ const DEFAULT_RESULTS_AMOUNT = 12; // chrome.topSites.get returns 12 items
 const MORE_RESULTS_AMOUNT = 50;
 
 const view = h(`
-  <div>
+  <div hidden>
     <h2 #t></h2>
 
     <div #l></div>
@@ -31,7 +31,6 @@ const view = h(`
 
 export const SearchResult = <T extends LinkProps>(
   sectionName: string,
-  data: T[],
 ): SearchResultComponent => {
   const root = view.cloneNode(true) as SearchResultComponent;
   const nodes = view.collect<RefNodes>(root);
@@ -78,7 +77,5 @@ export const SearchResult = <T extends LinkProps>(
 
   nodes.m.__click = () => renderList(rawData, renderedLength + MORE_RESULTS_AMOUNT);
 
-  update(data);
-
   return root;
 };