PPP diary - 2- March 2018
This week has been dedicated to research. It wasn’t planned, but I found some trouble on the front end application and, instead of quick fixing it, I wanted to understand what was really happening. It gave back some nice outcome!
React-hot-loader for Preact.js and Inferno.js
We have been playing with Preact.js and Inferno.js as the view libraries for our web app PassPill.
None of them played well with react-hot-loader. Their bootstrap tools just use webpack hot updates, instead of making single components to reload maintaining the state. I have been trying to hack them for a while, but seems that there is no a quick way of making them play along. The research at least lead to a pull request for preact that improve the integration with react-hot-loader v3.
I really love lightweight libraries like Preact.js and Inferno.js. I am decided to make hot-loading work properly for them, even if creating a preact-hot-loader or inferno-hot-loader library is needed. To do I have created the react-preact-inferno-hot-boilerplate repository to watch all the libraries run side by side and port react-hot-loader for them.
But more obstacles on the road! I stumbled upon problems when trying to run inferno with webpack 4. Last week it looked like nothing was working… :(
The actual problem was that Inferno.js 4 defines their EcmaScript modules in files with .mjs extensions, so I took the chance to write about them: Problems with .mjs files for EcmaScript modules. Next version will stop using mjs files, so I think I will wait until it’s released to start working on inferno-hot-loader.
I hope to have some time this week for progressing on hot loading. In any of you want to lend a hand, it would be very appreciated!
New library for state management
Besides the research work, we have been improving the first library released as part of the PassPill Project, up to the point that we’ve been able to replace freezer.js by our brand new onState.
I’ve been using freezer.js for years in many projects and it makes handling the app state really simple. If you never heard about freezer I recommend reading “React, the simple way”.
OnState follows the same ideas of freezer, but using JavaScript Proxies to make the state management even simpler.
We still need to document it and, for sure, we should expect some nice articles about it, written with love!
This article is part of the PassPill Project that wants to share the whole development of a web app. It’s part of the progress log we are having with it, you can have a look at what we did last week.
If you liked the post, don’t forget to follow our publication and @passpillio in twitter in order not to miss any update!
