Externalize and optimize JavaScript and CSS from index.htm

[pbolduc]

This issue is for a future PR that I will be submitting. This issue allows for discussion on moving the JavaScript and CSS out of the source index.htm file into separate files. During initial prototyping, using webpack to compact the JavaScript in wled00/data/index.htm, resulted in 1476 bytes (29325 -> 27849) reduction in the size of PAGE_index byte array. The end goal of this currently is still to have a single page with embedded CSS and JavaScript but smaller. Since the output is gzip'ed before embedding in the C source, the reduction is smaller.

Tasks

• [x] extract the large JavaScript block from wled00/data/index.htm into wled00/data/index.js
• [x] add webpack to minimize and inline the JavaScript
• [x] update tools/cdata.js to process the new output file wled00/data/dist/index.html into wled00/html_ui.h
• [x] update documentation for developers
• [x] extract the large CSS block from wled00/data/index.htm into wled00/data/index.css
• [x] add webpack to minimize and inline the CSS

Future Considerations

• [ ] make changes to the JavaScript to assist the minimizer (pulling common strings into consts, replace d.getElementById('name') with local function, etc).
• [ ] enable tree shaking to eliminate extra, unused code in 3rd party libs (ira, rangetouch)
• [ ] add jslint
• [ ] add csslint
• [ ] enhance development experience by not minimize JavaScript to assist in debugging locally from file system
• [x] add local server / live-reload capabilities to improve development time testing

[pbolduc]

Part of this change, I wonder if we could rename functions that are NOT called from the web page to start with underscore. See ESLint - Code Conventions. Knowing which methods are called from the UI and which are not make it easier for refactoring.

[blazoncek]

Most of the optimisations have been done for 0.14. What would be needed is more advanced (and recent) inliner.