Giters

ricokahler / color2k

a color parsing and manipulation lib served in roughly 2kB

Home Page:https://color2k.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Bundle size: SSR w/ getComputedStyle

ricokahler opened this issue · comments

commented

This lib used to be around 1.5kB in size because it deferred parsing colors to getComputedStyle instead of relying on javascript. This saves around 1kB because we can remove the compressed color map of named colors.

This implementation was removed in favor of a plain JS implementation because getComputedStyle does not work in SSR environments and attempts for conditionally imports did not pan out.

This issue exists to find a code path that works for both SSR and non-SSR environments and removes the named color map to get us back down to 2k

commented

I was working on another project where dead code elimination is required in the next.js land and it seems like they partially do dead code elimination by:

  1. using babel-transform-define to statically transformwindow typeof to either 'undefined' or 'object' depending on the environment.
  2. Relying on Terser to pre-evaluate and shake the expression in the conditions of code branches (e.g. if ('object' !== 'undefined')) out of the code due to the expression always being false (or something similar).

This is a very interesting approach. My previous attempts relied on conditionally requireing a compat package assuming the environment server-rendering wasn't sandboxed but this quickly fell apart when trying this out in Gatsby and Next.js.

I think if enough environments can support checking typeof window === 'undefined' for server code elimination, we might be able to ship a 1.5kB v2.

I'd happily accept PRs and experiments for this idea. Let me know if you're interested!

commented

Closing. This lib will prefer stability and compatibility over this 1kB of bundle size savings