Upgrade to Rails 6 and more
October 18, 2021
I upgraded the many libraries and frameworks that Owlstown is built on. I will list them below and leave some notes about them. This will be a boring post, but I want to document the upgrades. Upgrading is often an invisible task, but necessary because it allows Owlstown to support more features and improve its speed.
Rails 5.2.4 to Rails 6.0.4
I've been putting off this task for a while now. Rails 5.2 came out in 2018. Rails 6.0 came out in 2019. The latest version is Rails 6.1 I have to upgrade Rails from 5.2.4 to 6.0.4.
Material UI 4.11.0 to MUI 5.0.4
Material UI is the React component library that I use to build the Owlstown editor. Migration was made easy by the detailed migration guide and the convenient codemods. This upgrade allowed me to replace react-dates date picker with the MUI DatePicker. The MUI DatePicker supports various Javascript date libraries, so it allowed me to do the next update.
Rails 5.2.4 to Rails 6.0.4
I've been putting off this task for a while now. Rails 5.2 came out in 2018. Rails 6.0 came out in 2019. The latest version is Rails 6.1 I have to upgrade Rails from 5.2.4 to 6.0.4.
Material UI 4.11.0 to MUI 5.0.4
Material UI is the React component library that I use to build the Owlstown editor. Migration was made easy by the detailed migration guide and the convenient codemods. This upgrade allowed me to replace react-dates date picker with the MUI DatePicker. The MUI DatePicker supports various Javascript date libraries, so it allowed me to do the next update.
Replaced Moment with Day.js
Day.js is a much smaller library compared to Moment. I only need some date parsing and formatting, so being able to use a smaller library makes the Owlstown Editor faster to download.
Replaced Babel with ESBuild
Inspired by this article, I replaced Babel with ESBuild. This makes Javascript bundling faster.
Chart.js 2.9.4 to Chart.js 3.5.1
Similar to the MUI DatePicker, Chart.js 3 supports various Javascript date libraries, so I was able to use Day.js instead of Moment.
More updates
Day.js is a much smaller library compared to Moment. I only need some date parsing and formatting, so being able to use a smaller library makes the Owlstown Editor faster to download.
Replaced Babel with ESBuild
Inspired by this article, I replaced Babel with ESBuild. This makes Javascript bundling faster.
Chart.js 2.9.4 to Chart.js 3.5.1
Similar to the MUI DatePicker, Chart.js 3 supports various Javascript date libraries, so I was able to use Day.js instead of Moment.
More updates
- Use React from CDN.
- All assets are built by Webpacker and Sprockets.
- Reduced number of Javascript code that need to be processed by Erb (*.js.erb).
- Replaced slash as division with slash-div in SCSS.
- Used Pagy gem for pagination.
- Used PaddlePay gem for Paddle API support.