mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-07-13 03:27:39 +03:00
Hardcoded Styles/@Boot.css dropped some webpack KB overhead. We are going more mobile!
Also replaced some charAt() with []
This commit is contained in:
parent
0d81b2ce88
commit
ba8a566c69
5 changed files with 47 additions and 43 deletions
18
README.md
18
README.md
|
|
@ -72,23 +72,23 @@ Things might work in Edge 15-18, Firefox 47-62 and Chrome 54-68 due to one polyf
|
||||||
|
|
||||||
|js/* |1.14.0 |native |gzip 1.14 |gzip |
|
|js/* |1.14.0 |native |gzip 1.14 |gzip |
|
||||||
|----------- |--------: |--------: |--------: |--------: |
|
|----------- |--------: |--------: |--------: |--------: |
|
||||||
|admin.js |2.130.942 |1.210.405 | 485.481 | 297.481 |
|
|admin.js |2.130.942 |1.210.357 | 485.481 | 297.385 |
|
||||||
|app.js |4.184.455 |2.955.003 | 932.725 | 691.084 |
|
|app.js |4.184.455 |2.954.400 | 932.725 | 690.873 |
|
||||||
|boot.js | 671.522 | 93.585 | 169.502 | 28.270 |
|
|boot.js | 671.522 | 64.041 | 169.502 | 20.006 |
|
||||||
|libs.js | 647.614 | 437.187 | 194.728 | 133.728 |
|
|libs.js | 647.614 | 437.187 | 194.728 | 133.728 |
|
||||||
|polyfills.js | 325.834 | 0 | 71.825 | 0 |
|
|polyfills.js | 325.834 | 0 | 71.825 | 0 |
|
||||||
|TOTAL js |7.960.367 |4.696.180 |1.854.261 |1.150.563 |
|
|TOTAL js |7.960.367 |4.665.985 |1.854.261 |1.141.992 |
|
||||||
|
|
||||||
|js/min/* |1.14.0 |native |gzip 1.14 |gzip |
|
|js/min/* |1.14.0 |native |gzip 1.14 |gzip |
|
||||||
|--------------- |--------: |--------: |--------: |--------: |
|
|--------------- |--------: |--------: |--------: |--------: |
|
||||||
|admin.min.js | 252.147 | 156.119 | 73.657 | 44.594 |
|
|admin.min.js | 252.147 | 156.115 | 73.657 | 44.592 |
|
||||||
|app.min.js | 511.202 | 384.143 |140.462 |101.497 |
|
|app.min.js | 511.202 | 384.048 |140.462 |101.496 |
|
||||||
|boot.min.js | 66.007 | 11.545 | 22.567 | 4.437 |
|
|boot.min.js | 66.007 | 7.642 | 22.567 | 2.930 |
|
||||||
|libs.min.js | 572.545 | 392.436 |176.720 |123.484 |
|
|libs.min.js | 572.545 | 392.436 |176.720 |123.484 |
|
||||||
|polyfills.min.js | 32.452 | 0 | 11.312 | 0 |
|
|polyfills.min.js | 32.452 | 0 | 11.312 | 0 |
|
||||||
|TOTAL js/min |1.434.353 | 944.243 |424.718 |274.012 |
|
|TOTAL js/min |1.434.353 | 940.241 |424.718 |272.502 |
|
||||||
|
|
||||||
490.110 bytes (150.706 gzip) is not much, but it feels faster.
|
494.112 bytes (152.216 gzip) is not much, but it feels faster.
|
||||||
|
|
||||||
|
|
||||||
|css/* |1.14.0 |native |
|
|css/* |1.14.0 |native |
|
||||||
|
|
|
||||||
|
|
@ -44,10 +44,10 @@ const Base64 = {
|
||||||
|
|
||||||
output =
|
output =
|
||||||
output +
|
output +
|
||||||
BASE_64_CHR.charAt(enc1) +
|
BASE_64_CHR[enc1] +
|
||||||
BASE_64_CHR.charAt(enc2) +
|
BASE_64_CHR[enc2] +
|
||||||
BASE_64_CHR.charAt(enc3) +
|
BASE_64_CHR[enc3] +
|
||||||
BASE_64_CHR.charAt(enc4);
|
BASE_64_CHR[enc4];
|
||||||
}
|
}
|
||||||
|
|
||||||
return output;
|
return output;
|
||||||
|
|
@ -68,10 +68,10 @@ const Base64 = {
|
||||||
input = input.replace(/[^A-Za-z0-9\+\/\=]/g, '');
|
input = input.replace(/[^A-Za-z0-9\+\/\=]/g, '');
|
||||||
|
|
||||||
while (i < input.length) {
|
while (i < input.length) {
|
||||||
enc1 = BASE_64_CHR.indexOf(input.charAt(i++));
|
enc1 = BASE_64_CHR.indexOf(input[i++]);
|
||||||
enc2 = BASE_64_CHR.indexOf(input.charAt(i++));
|
enc2 = BASE_64_CHR.indexOf(input[i++]);
|
||||||
enc3 = BASE_64_CHR.indexOf(input.charAt(i++));
|
enc3 = BASE_64_CHR.indexOf(input[i++]);
|
||||||
enc4 = BASE_64_CHR.indexOf(input.charAt(i++));
|
enc4 = BASE_64_CHR.indexOf(input[i++]);
|
||||||
|
|
||||||
chr1 = (enc1 << 2) | (enc2 >> 4);
|
chr1 = (enc1 << 2) | (enc2 >> 4);
|
||||||
chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
|
chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,6 @@ import { getHash, setHash, clearHash } from 'Storage/RainLoop';
|
||||||
let RL_APP_DATA_STORAGE = null;
|
let RL_APP_DATA_STORAGE = null;
|
||||||
|
|
||||||
/* eslint-disable camelcase,spaced-comment */
|
/* eslint-disable camelcase,spaced-comment */
|
||||||
window.__rlah = () => getHash();
|
|
||||||
window.__rlah_set = () => setHash();
|
window.__rlah_set = () => setHash();
|
||||||
window.__rlah_clear = () => clearHash();
|
window.__rlah_clear = () => clearHash();
|
||||||
window.__rlah_data = () => RL_APP_DATA_STORAGE;
|
window.__rlah_data = () => RL_APP_DATA_STORAGE;
|
||||||
|
|
@ -45,6 +44,16 @@ function runMainBoot(withError) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const doc = window.document;
|
||||||
|
|
||||||
|
function writeCSS(css) {
|
||||||
|
const style = doc.createElement('style');
|
||||||
|
style.type = 'text/css';
|
||||||
|
style.textContent = css;
|
||||||
|
// style.appendChild(doc.createTextNode(styles));
|
||||||
|
doc.head.appendChild(style);
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @param {mixed} data
|
* @param {mixed} data
|
||||||
* @returns {void}
|
* @returns {void}
|
||||||
|
|
@ -54,8 +63,6 @@ window.__initAppData = data => {
|
||||||
|
|
||||||
window.__rlah_set();
|
window.__rlah_set();
|
||||||
|
|
||||||
const doc = window.document;
|
|
||||||
|
|
||||||
if (RL_APP_DATA_STORAGE) {
|
if (RL_APP_DATA_STORAGE) {
|
||||||
const css = RL_APP_DATA_STORAGE.IncludeCss,
|
const css = RL_APP_DATA_STORAGE.IncludeCss,
|
||||||
theme = RL_APP_DATA_STORAGE.NewThemeLink,
|
theme = RL_APP_DATA_STORAGE.NewThemeLink,
|
||||||
|
|
@ -67,13 +74,7 @@ window.__initAppData = data => {
|
||||||
(doc.getElementById('app-theme-link') || {}).href = theme;
|
(doc.getElementById('app-theme-link') || {}).href = theme;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (css) {
|
css && writeCSS(css);
|
||||||
const style = doc.createElement('style');
|
|
||||||
style.type = 'text/css';
|
|
||||||
style.textContent = css;
|
|
||||||
// style.appendChild(doc.createTextNode(styles));
|
|
||||||
doc.head.appendChild(style);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (oElDesc && description) {
|
if (oElDesc && description) {
|
||||||
oElDesc.innerHTML = description;
|
oElDesc.innerHTML = description;
|
||||||
|
|
@ -97,11 +98,12 @@ window.__initAppData = data => {
|
||||||
) {
|
) {
|
||||||
p.start().set(5);
|
p.start().set(5);
|
||||||
|
|
||||||
const libs = () =>
|
const loadScript = jassl,
|
||||||
jassl(appData.StaticLibJsLink).then(() => {
|
libs = () =>
|
||||||
|
loadScript(appData.StaticLibJsLink).then(() => {
|
||||||
doc.getElementById('rl-check').remove();
|
doc.getElementById('rl-check').remove();
|
||||||
if (appData.IncludeBackground) {
|
if (appData.IncludeBackground) {
|
||||||
const img = appData.IncludeBackground.replace('{{USER}}', window.__rlah ? window.__rlah() || '0' : '0');
|
const img = appData.IncludeBackground.replace('{{USER}}', getHash() || '0');
|
||||||
if (img) {
|
if (img) {
|
||||||
doc.documentElement.classList.add('UserBackground');
|
doc.documentElement.classList.add('UserBackground');
|
||||||
doc.body.style.backgroundImage = "url("+img+")";
|
doc.body.style.backgroundImage = "url("+img+")";
|
||||||
|
|
@ -112,15 +114,15 @@ window.__initAppData = data => {
|
||||||
libs()
|
libs()
|
||||||
.then(() => {
|
.then(() => {
|
||||||
p.set(20);
|
p.set(20);
|
||||||
return window.Promise.all([jassl(appData.TemplatesLink), jassl(appData.LangLink)]);
|
return window.Promise.all([loadScript(appData.TemplatesLink), loadScript(appData.LangLink)]);
|
||||||
})
|
})
|
||||||
.then(() => {
|
.then(() => {
|
||||||
p.set(30);
|
p.set(30);
|
||||||
return jassl(appData.StaticAppJsLink);
|
return loadScript(appData.StaticAppJsLink);
|
||||||
})
|
})
|
||||||
.then(() => {
|
.then(() => {
|
||||||
p.set(50);
|
p.set(50);
|
||||||
return appData.PluginsLink ? jassl(appData.PluginsLink) : window.Promise.resolve();
|
return appData.PluginsLink ? loadScript(appData.PluginsLink) : window.Promise.resolve();
|
||||||
})
|
})
|
||||||
.then(() => {
|
.then(() => {
|
||||||
p.set(70);
|
p.set(70);
|
||||||
|
|
@ -130,7 +132,7 @@ window.__initAppData = data => {
|
||||||
runMainBoot(true);
|
runMainBoot(true);
|
||||||
throw e;
|
throw e;
|
||||||
})
|
})
|
||||||
.then(() => jassl(appData.StaticEditorJsLink))
|
.then(() => loadScript(appData.StaticEditorJsLink))
|
||||||
.then(() => {
|
.then(() => {
|
||||||
if (window.CKEDITOR && window.__initEditor) {
|
if (window.CKEDITOR && window.__initEditor) {
|
||||||
window.__initEditor();
|
window.__initEditor();
|
||||||
|
|
@ -153,7 +155,8 @@ window.__runBoot = () => {
|
||||||
doc.location.replace('./?/NoCookie');
|
doc.location.replace('./?/NoCookie');
|
||||||
}
|
}
|
||||||
|
|
||||||
require('Styles/@Boot.css');
|
// require('Styles/@Boot.css');
|
||||||
|
writeCSS('#rl-content{display:none;}.internal-hiddden{display:none !important;}');
|
||||||
|
|
||||||
if (app) {
|
if (app) {
|
||||||
const layout = require('Html/Layout.html'),
|
const layout = require('Html/Layout.html'),
|
||||||
|
|
@ -170,7 +173,7 @@ window.__runBoot = () => {
|
||||||
+ (options.mobile ? 'mobile' : 'no-mobile')
|
+ (options.mobile ? 'mobile' : 'no-mobile')
|
||||||
+ (options.mobileDevice ? '-1' : '-0')
|
+ (options.mobileDevice ? '-1' : '-0')
|
||||||
+ '/'
|
+ '/'
|
||||||
+ (window.__rlah ? window.__rlah() || '0' : '0')
|
+ (getHash() || '0')
|
||||||
+ '/'
|
+ '/'
|
||||||
+ window.Math.random().toString().substr(2)
|
+ window.Math.random().toString().substr(2)
|
||||||
+ '/';
|
+ '/';
|
||||||
|
|
|
||||||
|
|
@ -13,7 +13,8 @@ export function jassl(src, async = false) {
|
||||||
}
|
}
|
||||||
|
|
||||||
return new window.Promise((resolve, reject) => {
|
return new window.Promise((resolve, reject) => {
|
||||||
const element = window.document.createElement('script');
|
const doc = window.document,
|
||||||
|
element = doc.createElement('script');
|
||||||
|
|
||||||
element.onload = () => {
|
element.onload = () => {
|
||||||
resolve(src);
|
resolve(src);
|
||||||
|
|
@ -26,7 +27,7 @@ export function jassl(src, async = false) {
|
||||||
element.async = !!async;
|
element.async = !!async;
|
||||||
element.src = src;
|
element.src = src;
|
||||||
|
|
||||||
window.document.body.appendChild(element);
|
doc.body.appendChild(element);
|
||||||
}) /* .then((s) => {
|
}) /* .then((s) => {
|
||||||
|
|
||||||
const found = s && rainloopCaches ? s.match(/rainloop\/v\/([^\/]+)\/static\//) : null;
|
const found = s && rainloopCaches ? s.match(/rainloop\/v\/([^\/]+)\/static\//) : null;
|
||||||
|
|
|
||||||
|
|
@ -37,9 +37,9 @@ const __get = (key) => {
|
||||||
let result = null;
|
let result = null;
|
||||||
if (SESS_STORAGE) {
|
if (SESS_STORAGE) {
|
||||||
result = SESS_STORAGE.getItem(key) || null;
|
result = SESS_STORAGE.getItem(key) || null;
|
||||||
} else if (WIN_STORAGE && window.JSON) {
|
} else if (WIN_STORAGE) {
|
||||||
const data =
|
const data =
|
||||||
WIN_STORAGE.name && '{' === WIN_STORAGE.name.toString().substr(0, 1)
|
WIN_STORAGE.name && '{' === WIN_STORAGE.name.toString()[0]
|
||||||
? window.JSON.parse(WIN_STORAGE.name.toString())
|
? window.JSON.parse(WIN_STORAGE.name.toString())
|
||||||
: null;
|
: null;
|
||||||
result = data ? data[key] || null : null;
|
result = data ? data[key] || null : null;
|
||||||
|
|
@ -53,7 +53,7 @@ const __set = (key, value) => {
|
||||||
SESS_STORAGE.setItem(key, value);
|
SESS_STORAGE.setItem(key, value);
|
||||||
} else if (WIN_STORAGE) {
|
} else if (WIN_STORAGE) {
|
||||||
let data =
|
let data =
|
||||||
WIN_STORAGE.name && '{' === WIN_STORAGE.name.toString().substr(0, 1)
|
WIN_STORAGE.name && '{' === WIN_STORAGE.name.toString()[0]
|
||||||
? JSON.parse(WIN_STORAGE.name.toString())
|
? JSON.parse(WIN_STORAGE.name.toString())
|
||||||
: null;
|
: null;
|
||||||
data = data || {};
|
data = data || {};
|
||||||
|
|
@ -102,7 +102,7 @@ export function clearHash() {
|
||||||
* @returns {boolean}
|
* @returns {boolean}
|
||||||
*/
|
*/
|
||||||
export function checkTimestamp() {
|
export function checkTimestamp() {
|
||||||
if (timestamp() > getTimestamp() + 1000 * 60 * 60) {
|
if (timestamp() > getTimestamp() + 3600000) {
|
||||||
// 60m
|
// 60m
|
||||||
clearHash();
|
clearHash();
|
||||||
return true;
|
return true;
|
||||||
|
|
@ -111,4 +111,4 @@ export function checkTimestamp() {
|
||||||
}
|
}
|
||||||
|
|
||||||
// init section
|
// init section
|
||||||
setInterval(setTimestamp, 1000 * 60); // 1m
|
setInterval(setTimestamp, 60000); // 1m
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue