@spalladino it’s been awhile! I’d be happy to chime in. My front end toolset has evolved significantly since I started building dapps.
The first toolset was React, Redux and Web3.js 0.20. The callback version of web3.js was clunky, but it worked. Writing Redux code from scratch meant that the cache lifecycle was managed manually and there was a lot of boilerplate. The tools left much to be desired.
Next I tried Drizzle, which is a framework that wraps React, Redux and Web3.js 1.0. The framework provides basic Web3 state out-of-the-box (i.e. network, account, balance), but it’s approach to caching exposes the mechanism rather than abstracts it: for each web3 call users must keep track of a cache key to lookup the data in the Redux state. The results in much added complexity. Additionally, web3.js 1.0 was extremely buggy and lacked event subscriptions.
Finally what I realized is that web dapps are simply caches for remote data. For the most performant application possible, we needed a powerful caching framework that allowed us to invalidate portions of local state in response to remote changes. Enter the Apollo framework. We developed a custom “link” for Apollo that allows us to use GraphQL to speak to Ethereum clients called apollo-link-ethereum. The link uses ethers.js instead of web3.js, as it is actively maintained, well documented, and relatively bug-free.
Now, not all applications are going to need to cache smart contract data. After reading the above I had a quick look at web3-react, and it looks like a nice way to quickly put a small application together. If you build something with enough complexity, however, you’ll eventually need to optimize the application by having a global shared state. I highly recommend having a look at our framework for larger applications.
tldr; The best library to use to connect to Ethereum right now is ethers.js. For small user interfaces web3 component kits would suffice, but for anything larger you’ll need to consider caching.
Hope this helps! I’d love to hear other people’s thoughts as well.