Build-time optimisations via Bable-macros

[danieldelcore]

We should look into this as a way to reduce runtime costs! And set us up for zero-config SSR:

https://babeljs.io/blog/2017/09/11/zero-config-with-babel-macros

so using the babel macro we could go from this:

/** @jsx jsx */
import { css, jsx} from '@trousers/core'

const styles = css`
  color: white;
`;

const Button = props => {
    const classNames = useStyles(styles, props);

    return <button className={buttonClassNames}>{props.children}</button>;
};

export default Button;

to this:

/** @jsx jsx */
import { css, jsx} from '@trousers/macro'

const styles = css`
  color: white;
`;

const Button = props => {
    return <button css={styles}>{props.children}</button>;
};

export default Button;

• So we'll swap our JSX pragma for one that can support zero runtime
• Allows us to keep the current API for people who don't want to opt into the CSS prop etc
• Perform optimisations on the CSS like
  • Removing comments
  • Vendor prefixing
  • Other cool stuff?