Skip to content

Instantly share code, notes, and snippets.

@nataliemarleny

nataliemarleny/investigation.md

Last active April 7, 2019 10:15
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save nataliemarleny/78d9350369171ad662b19cb22e73cf08 to your computer and use it in GitHub Desktop.
Save nataliemarleny/78d9350369171ad662b19cb22e73cf08 to your computer and use it in GitHub Desktop.
Download ZIP
createElement Investigation
Raw
investigation.md

Investigation into the createElement problem

Test 1 - create a minimal React app, unoptimized

  1. Create an app using the following instructions: https://gist.github.com/nataliemarleny/78fb26ac874a013b7fce4dc0c80eee8f

  2. Downloaded all JS files from "Chrome Dev-tools > Sources":

  3. Count number of lines createElement appears in:

grep createElement *.js | wc -l

Result: 41

  1. Count number of occurrences createElement appears in:
grep -o createElement *.js | wc -l

Result: 97

Size in bytes: 97 B * 13 = 1261 B

  1. Size of the files downloaded
du -sh
du -sb

Size: 1.7 MB = 1693030 B

  1. createElement takes up:
node -p -e '(97 * 13) / 1693030 * 100'

0.07% of the entire size

Test 2 - check createElement instances in the production deployed shop.lego.com

Repeated all steps

  • Count of lines containing createElement: 32
  • Count of createElement occurrences: 2290
  • Size of all files: 1707595 B = 1.8M
  • Percentage of all files: (2290 * 13) / 1707595 * 100 = 1.74%
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment