MQuy

Installing V8 on a Mac

Prerequisites

• Install Xcode (Avaliable on the Mac App Store)
• Install Xcode Command Line Tools (Preferences > Downloads)
• Install depot_tools
  • git clone https://chromium.googlesource.com/chromium/tools/depot_tools.git
  • sudo nano ~/.bash_profile
  • Add export PATH=/path/to/depot_tools:"$PATH" (it's important that depot_tools comes first here)

MQuy

Folder Structure

src
├── components
│   ├── Dropdown
│   │   ├── Dropdown.tsx
│   │   └── dropdown.less
│   └── VerificationModal
│       ├── VerificationSummary

MQuy

WTF is deadcode elimination? How to do it by yourself

Scenario

According to wiki

Deadcode elimination is a compiler optimization to remove code which does not affect the program results.

• Past me: 🤩it is the compiler's job to do deadcode elimination and we, developers, don't have to care anything about it right.
• Me: 🙅🏼It is also our duty, developers, to clean our own 💩.

MQuy

How to reduce stylesheet's size by 55% and even more?

Before diving into Long answer 👩‍🏫, let see why stylesheet's size is one of the most important factors in term of web experience.

In general, a stylesheet is just bunch of rules/selectors which can be defined in:

• External files.
• Style tags.
• Inline style attributes.

✍️ There are a lot of discussions for pros and cons of each approach and it's beyond the scope of this article, but if you are interested in you can read here.

MQuy

Usage

$ yarn
$ cd node_modules/ts-loader && yarn && yarn build
$ cd packages/areas/invoices && yarn start

Structure

MQuy

Separated frontend bundles

• Status: active
• Date: 2020-09-22

Context and Problem Statement

Most web browsers have good support for es6+ features while serving legacy/polyfills will increase and harm our user experience. According to our google analytics

| Browsers | Sessions |