odit/mailymaily
4
0
Fork 0
Code Issues Pull Requests Projects Releases 2 Wiki Activity

a test: trying to reduce bundle size, reduced of 0.4kb renaming appendChild function

Browse Source
This commit is contained in:
Matteo Manzinello 2020-01-09 22:34:52 +01:00
parent 4a343d088c
commit 4293a9474e
3 changed files with 70 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dist/mailgo.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
mailgo.js
View File

File diff suppressed because one or more lines are too long

131
src/mailgo.js
View File

@ -59,18 +59,18 @@ const mailgoVersion = "MAILGO_VERSION";
// background // background
let modalBackground = createElement("div"); let modalBackground = createElement("div");
modalBackground.className = "m-modal-back"; modalBackground.className = "m-modal-back";
modal.appendChild(modalBackground); modal.ac(modalBackground);
// modal content // modal content
let modalContent = createElement("div"); let modalContent = createElement("div");
modalContent.className = "m-modal-content"; modalContent.className = "m-modal-content";
modal.appendChild(modalContent); modal.ac(modalContent);
// title (email address) // title (email address)
title = createElement("strong"); title = createElement("strong");
title.id = "m-title"; title.id = "m-title";
title.className = "m-title"; title.className = "m-title";
modalContent.appendChild(title); modalContent.ac(title);
// details // details
let details = createElement("div"); let details = createElement("div");
@ -82,50 +82,50 @@ const mailgoVersion = "MAILGO_VERSION";
let ccSpan = createElement("span"); let ccSpan = createElement("span");
ccSpan.className = "w-500"; ccSpan.className = "w-500";
let ccContent = createTextNode("cc "); let ccContent = createTextNode("cc ");
ccSpan.appendChild(ccContent); ccSpan.ac(ccContent);
ccValue = createElement("span"); ccValue = createElement("span");
ccValue.id = "m-cc-value"; ccValue.id = "m-cc-value";
detailCc.appendChild(ccSpan); detailCc.ac(ccSpan);
detailCc.appendChild(ccValue); detailCc.ac(ccValue);
details.appendChild(detailCc); details.ac(detailCc);
detailBcc = createElement("p"); detailBcc = createElement("p");
detailBcc.id = "m-bcc"; detailBcc.id = "m-bcc";
let bccSpan = createElement("span"); let bccSpan = createElement("span");
bccSpan.className = "w-500"; bccSpan.className = "w-500";
let bccContent = createTextNode("bcc "); let bccContent = createTextNode("bcc ");
bccSpan.appendChild(bccContent); bccSpan.ac(bccContent);
bccValue = createElement("span"); bccValue = createElement("span");
bccValue.id = "m-bcc-value"; bccValue.id = "m-bcc-value";
detailBcc.appendChild(bccSpan); detailBcc.ac(bccSpan);
detailBcc.appendChild(bccValue); detailBcc.ac(bccValue);
details.appendChild(detailBcc); details.ac(detailBcc);
detailSubject = createElement("p"); detailSubject = createElement("p");
detailSubject.id = "m-subject"; detailSubject.id = "m-subject";
let subjectSpan = createElement("span"); let subjectSpan = createElement("span");
subjectSpan.className = "w-500"; subjectSpan.className = "w-500";
let subjectContent = createTextNode("subject "); let subjectContent = createTextNode("subject ");
subjectSpan.appendChild(subjectContent); subjectSpan.ac(subjectContent);
subjectValue = createElement("span"); subjectValue = createElement("span");
subjectValue.id = "m-subject-value"; subjectValue.id = "m-subject-value";
detailSubject.appendChild(subjectSpan); detailSubject.ac(subjectSpan);
detailSubject.appendChild(subjectValue); detailSubject.ac(subjectValue);
details.appendChild(detailSubject); details.ac(detailSubject);
detailBody = createElement("p"); detailBody = createElement("p");
detailBody.id = "m-body"; detailBody.id = "m-body";
let bodySpan = createElement("span"); let bodySpan = createElement("span");
bodySpan.className = "w-500"; bodySpan.className = "w-500";
let bodyContent = createTextNode("body "); let bodyContent = createTextNode("body ");
bodySpan.appendChild(bodyContent); bodySpan.ac(bodyContent);
bodyValue = createElement("span"); bodyValue = createElement("span");
bodyValue.id = "m-body-value"; bodyValue.id = "m-body-value";
detailBody.appendChild(bodySpan); detailBody.ac(bodySpan);
detailBody.appendChild(bodyValue); detailBody.ac(bodyValue);
details.appendChild(detailBody); details.ac(detailBody);
modalContent.appendChild(details); modalContent.ac(details);
// Gmail // Gmail
gmail = createElement("a"); gmail = createElement("a");
@ -134,14 +134,14 @@ const mailgoVersion = "MAILGO_VERSION";
gmail.classList.add("m-open"); gmail.classList.add("m-open");
gmail.classList.add("m-gmail"); gmail.classList.add("m-gmail");
let gmailContent = createTextNode("open in "); let gmailContent = createTextNode("open in ");
gmail.appendChild(gmailContent); gmail.ac(gmailContent);
let gmailSpan = createElement("span"); let gmailSpan = createElement("span");
gmailSpan.className = "w-500"; gmailSpan.className = "w-500";
let gmailSpanContent = createTextNode("Gmail"); let gmailSpanContent = createTextNode("Gmail");
gmailSpan.appendChild(gmailSpanContent); gmailSpan.ac(gmailSpanContent);
gmail.appendChild(gmailSpan); gmail.ac(gmailSpan);
modalContent.appendChild(gmail); modalContent.ac(gmail);
// Outlook // Outlook
outlook = createElement("a"); outlook = createElement("a");
@ -150,14 +150,14 @@ const mailgoVersion = "MAILGO_VERSION";
outlook.classList.add("m-open"); outlook.classList.add("m-open");
outlook.classList.add("m-outlook"); outlook.classList.add("m-outlook");
let outlookContent = createTextNode("open in "); let outlookContent = createTextNode("open in ");
outlook.appendChild(outlookContent); outlook.ac(outlookContent);
let outlookSpan = createElement("span"); let outlookSpan = createElement("span");
outlookSpan.className = "w-500"; outlookSpan.className = "w-500";
let outlookSpanContent = createTextNode("Outlook"); let outlookSpanContent = createTextNode("Outlook");
outlookSpan.appendChild(outlookSpanContent); outlookSpan.ac(outlookSpanContent);
outlook.appendChild(outlookSpan); outlook.ac(outlookSpan);
modalContent.appendChild(outlook); modalContent.ac(outlook);
// open default // open default
open = createElement("a"); open = createElement("a");
@ -168,12 +168,12 @@ const mailgoVersion = "MAILGO_VERSION";
let openSpan = createElement("span"); let openSpan = createElement("span");
openSpan.className = "w-500"; openSpan.className = "w-500";
let openSpanContent = createTextNode("open"); let openSpanContent = createTextNode("open");
openSpan.appendChild(openSpanContent); openSpan.ac(openSpanContent);
let openContent = createTextNode(" default"); let openContent = createTextNode(" default");
open.appendChild(openSpan); open.ac(openSpan);
open.appendChild(openContent); open.ac(openContent);
modalContent.appendChild(open); modalContent.ac(open);
// copy // copy
copyMail = createElement("a"); copyMail = createElement("a");
@ -182,14 +182,14 @@ const mailgoVersion = "MAILGO_VERSION";
copyMail.classList.add("m-copy"); copyMail.classList.add("m-copy");
copyMail.classList.add("w-500"); copyMail.classList.add("w-500");
let copyContent = createTextNode("copy"); let copyContent = createTextNode("copy");
copyMail.appendChild(copyContent); copyMail.ac(copyContent);
modalContent.appendChild(copyMail); modalContent.ac(copyMail);
modalContent.appendChild(byElement()); modalContent.ac(byElement());
// add the modal at the end of the body // add the modal at the end of the body
document.body.appendChild(modal); document.body.ac(modal);
// every click outside the modal will hide the modal // every click outside the modal will hide the modal
modalBackground.addEventListener("click", hideMailgo); modalBackground.addEventListener("click", hideMailgo);
@ -205,18 +205,18 @@ const mailgoVersion = "MAILGO_VERSION";
// background // background
let modalBackground = createElement("div"); let modalBackground = createElement("div");
modalBackground.className = "m-modal-back"; modalBackground.className = "m-modal-back";
modal.appendChild(modalBackground); modal.ac(modalBackground);
// modal content // modal content
let modalContent = createElement("div"); let modalContent = createElement("div");
modalContent.className = "m-modal-content"; modalContent.className = "m-modal-content";
modal.appendChild(modalContent); modal.ac(modalContent);
// title (telephone number) // title (telephone number)
titleTel = createElement("strong"); titleTel = createElement("strong");
titleTel.id = "m-tel-title"; titleTel.id = "m-tel-title";
titleTel.className = "m-title"; titleTel.className = "m-title";
modalContent.appendChild(titleTel); modalContent.ac(titleTel);
// Telegram // Telegram
telegram = createElement("a"); telegram = createElement("a");
@ -229,14 +229,14 @@ const mailgoVersion = "MAILGO_VERSION";
telegram.style.display = "none"; telegram.style.display = "none";
let telegramContent = createTextNode("open in "); let telegramContent = createTextNode("open in ");
telegram.appendChild(telegramContent); telegram.ac(telegramContent);
let telegramSpan = createElement("span"); let telegramSpan = createElement("span");
telegramSpan.className = "w-500"; telegramSpan.className = "w-500";
let telegramSpanContent = createTextNode("Telegram"); let telegramSpanContent = createTextNode("Telegram");
telegramSpan.appendChild(telegramSpanContent); telegramSpan.ac(telegramSpanContent);
telegram.appendChild(telegramSpan); telegram.ac(telegramSpan);
modalContent.appendChild(telegram); modalContent.ac(telegram);
// WhatsApp // WhatsApp
wa = createElement("a"); wa = createElement("a");
@ -245,14 +245,14 @@ const mailgoVersion = "MAILGO_VERSION";
wa.classList.add("m-open"); wa.classList.add("m-open");
wa.classList.add("m-wa"); wa.classList.add("m-wa");
let waContent = createTextNode("open in "); let waContent = createTextNode("open in ");
wa.appendChild(waContent); wa.ac(waContent);
let waSpan = createElement("span"); let waSpan = createElement("span");
waSpan.className = "w-500"; waSpan.className = "w-500";
let waSpanContent = createTextNode("WhatsApp"); let waSpanContent = createTextNode("WhatsApp");
waSpan.appendChild(waSpanContent); waSpan.ac(waSpanContent);
wa.appendChild(waSpan); wa.ac(waSpan);
modalContent.appendChild(wa); modalContent.ac(wa);
// Skype // Skype
skype = createElement("a"); skype = createElement("a");
@ -261,14 +261,14 @@ const mailgoVersion = "MAILGO_VERSION";
skype.classList.add("m-open"); skype.classList.add("m-open");
skype.classList.add("m-skype"); skype.classList.add("m-skype");
let skypeContent = createTextNode("open in "); let skypeContent = createTextNode("open in ");
skype.appendChild(skypeContent); skype.ac(skypeContent);
let skypeSpan = createElement("span"); let skypeSpan = createElement("span");
skypeSpan.className = "w-500"; skypeSpan.className = "w-500";
let skypeSpanContent = createTextNode("Skype"); let skypeSpanContent = createTextNode("Skype");
skypeSpan.appendChild(skypeSpanContent); skypeSpan.ac(skypeSpanContent);
skype.appendChild(skypeSpan); skype.ac(skypeSpan);
modalContent.appendChild(skype); modalContent.ac(skype);
// call default // call default
call = createElement("a"); call = createElement("a");
@ -279,12 +279,12 @@ const mailgoVersion = "MAILGO_VERSION";
let callSpan = createElement("span"); let callSpan = createElement("span");
callSpan.className = "w-500"; callSpan.className = "w-500";
let callSpanContent = createTextNode("call"); let callSpanContent = createTextNode("call");
callSpan.appendChild(callSpanContent); callSpan.ac(callSpanContent);
let callContent = createTextNode(" as default"); let callContent = createTextNode(" as default");
call.appendChild(callSpan); call.ac(callSpan);
call.appendChild(callContent); call.ac(callContent);
modalContent.appendChild(call); modalContent.ac(call);
// copy // copy
copyTel = createElement("a"); copyTel = createElement("a");
@ -293,14 +293,14 @@ const mailgoVersion = "MAILGO_VERSION";
copyTel.classList.add("m-copy"); copyTel.classList.add("m-copy");
copyTel.classList.add("w-500"); copyTel.classList.add("w-500");
let copyContent = createTextNode("copy"); let copyContent = createTextNode("copy");
copyTel.appendChild(copyContent); copyTel.ac(copyContent);
modalContent.appendChild(copyTel); modalContent.ac(copyTel);
modalContent.appendChild(byElement()); modalContent.ac(byElement());
// add the modal at the end of the body // add the modal at the end of the body
document.body.appendChild(modal); document.body.ac(modal);
// every click outside the modal will hide the modal // every click outside the modal will hide the modal
modalBackground.addEventListener("click", hideMailgo); modalBackground.addEventListener("click", hideMailgo);
@ -764,7 +764,7 @@ const mailgoVersion = "MAILGO_VERSION";
by.target = "_blank"; by.target = "_blank";
by.rel = "noopener noreferrer"; by.rel = "noopener noreferrer";
let textBy = createTextNode("mailgo.js.org"); let textBy = createTextNode("mailgo.js.org");
by.appendChild(textBy); by.ac(textBy);
return by; return by;
}; };
@ -775,6 +775,11 @@ const mailgoVersion = "MAILGO_VERSION";
// create element // create element
const createElement = element => document.createElement(element); const createElement = element => document.createElement(element);
// append child (prototype)
HTMLElement.prototype.ac = function(childElement) {
return this.appendChild(childElement);
};
// create text node // create text node
const createTextNode = element => document.createTextNode(element); const createTextNode = element => document.createTextNode(element);
@ -827,7 +832,7 @@ const mailgoVersion = "MAILGO_VERSION";
el.setAttribute("readonly", ""); el.setAttribute("readonly", "");
el.style.position = "absolute"; el.style.position = "absolute";
el.style.left = "-9999px"; el.style.left = "-9999px";
document.body.appendChild(el); document.body.ac(el);
let selected = let selected =
document.getSelection().rangeCount > 0 document.getSelection().rangeCount > 0
? document.getSelection().getRangeAt(0) ? document.getSelection().getRangeAt(0)
@ -850,8 +855,8 @@ const mailgoVersion = "MAILGO_VERSION";
mailgoCSS.id = "mailgo-style"; mailgoCSS.id = "mailgo-style";
mailgoCSS.type = "text/css"; mailgoCSS.type = "text/css";
let mailgoCSSContent = createTextNode(`MAILGO_STYLE`); let mailgoCSSContent = createTextNode(`MAILGO_STYLE`);
mailgoCSS.appendChild(mailgoCSSContent); mailgoCSS.ac(mailgoCSSContent);
document.head.appendChild(mailgoCSS); document.head.ac(mailgoCSS);
// DOMContentLoaded -> mailgoInit (creates the modals) // DOMContentLoaded -> mailgoInit (creates the modals)
document.addEventListener("DOMContentLoaded", mailgoInit); document.addEventListener("DOMContentLoaded", mailgoInit);