Could you introduce your app in a few sentences?
MemPa is a deterministic password manager. It helps you generate passwords for your sites and apps, starting from one or a few master passwords. The great thing about MemPa is that you can access your passwords anywhere: even without the app you can recover them with a 1-line script.
You may want to think about a deterministic password manager like MemPa for all the critical passwords that you don’t want to store, but you always want to be able to access, without depending upon a specific app, device, or 3rd party site. Clearly, having an app is very convenient on the day to day and this is why we’re working on MemPa.
As of today we have released what we consider an MVP for iOS, though it’s perfectly usable, especially if you have both an iPhone and a Mac (did you know you can copy a password on the iPhone and paste it on your Mac?). An Android version is available on Expo and we’ll be releasing it on the store very soon.
What made you decide to use/switch to React Native?
We started with RN/Expo right away, and it was a pretty natural decision. Personally, I’ve been using React for all my side projects for the past... 4 years maybe? And I love its one way data flow model. In addition, as a team, we have more web development experience than mobile.
We looked at the main features for MemPa, and we couldn’t think of anything that requires native development. To the contrary, we felt that using RN could help us keep feature parity between iOS and Android, and hopefully add more platforms one day.
We did a quick cross check against what Expo is adding on top of vanilla RN, we found the Fingerprint and SecureStore, and decided to move forward with Expo.
How did you transition to React Native?
Each member of the team has a background in security, with a different specialty in terms of programming languages, from C to Clojure & Scala. JavaScript is something that everybody knew, but nobody really had years of working experience with.
The most important tool we started with was ESLint, with Airbnb config. As trivial as this may seem, it allowed us to work on each other’s code seamlessly. Especially at the beginning, you get mad at the linter for each line of code you write, but at least you don’t get to hate your team for each line of code you read.
Have your tried other cross platform technologies before using React Native?
Cordova/Phone Gap, but no one in the team likes it. We all like apps with a native look & feel. To be fair, also with RN we’re doing some tradeoffs, for example we don’t have the new iOS 11 navigation yet, but I guess we’re willing to accept some limitations if we can write cross-platform code.
[Issues with Cordova/PhoneGap]:
Mostly I’d say the look & feel. Scrolling, navigation... we didn’t really even consider Cordova for MemPa, based on my direct experience a few years ago (so things may have improved), and comments from the other team members who used it more in past works.
What has your experience been working with React Native in terms of app performance, have you noticed any impacts?
Nothing major, but we had two issues in terms of performance. First, with rich virtualized lists, and second with CPU-intensive code in JS.
On the virtualized list, the short story is that we had to turn virtualization off. The main list in MemPa has 2 sections, categories and sites, and an optional search bar. We wanted the search to be reachable by pulling down the list, as it normally happens in iOS (e.g., in the settings.) In theory this is easy to achieve with an offset, but for various reasons we were always hitting a rendering issue, typically when closing the search bar. Turning off virtualization fixed it, and it’s probably fine given MemPa's use, but still this is something we’d like to revisit.
On the CPU-intensive code, we have a case where we run a heavy cryptographic function, PBKDF2, to store a master password encrypted. This is pretty CPU intensive and, especially on old devices, it may freeze the app even for a second or two, which is a pretty bad user experience. Today we run the default implementation from CryptoJS, and we’ll be looking if we can accelerate it using in-browser or native cryptography.
How has adopting React Native affected developer productivity?
As I mentioned above, in our case choosing RN was a pretty natural decision. Most of MemPa's code isn’t platform specific, and so far we liked that anybody in the team can work on a feature or fix a bug on both Android and iOS.
There’s also another side of the coin, unfortunately. You build something, test on iOS, and then discover that Android works differently. For example, we had an issue with the Fingerprint component in Expo: in iOS it shows a system popup to the user, while in Android it’s the developer responsibility to deal with that. Overall this is still better than writing in 2 different languages, but it can introduce unexpected delays in releasing a feature. For this, we still consider iOS and Android two independent apps, each one with its own release process.
Which tools, libraries and frameworks are part of your development process with React Native?
These are the main dependencies: Expo, ESLint, react-redux, react-navigation, react-native-gesture-handler, react-native-elements, crypto-js, js-yaml.
I personally code in sublime + iOS emulator, others in the team have different stacks including Vim and of course Android emulators.
We use Github and CircleCI for development, and we rely on Expo to build the final apps.
What resources have you used to learn React Native? Books, tutorials, courses etc. Anything you can recommend?
Mostly the docs, and source code when things don’t seem to match the docs (never trust the docs!)
For example, for react-native-elements we looked a lot at their source code, and in some cases also copied & pasted & adapted their components.
I also really like the RN newsletter from Infinite Red. It’s a great way to keep up with what’s new, hear about new components & projects.
What are some things that you don’t like about React Native or that need to be improved?
So many things… :) The most frustrating one for me is not having the latest & greatest UX/UI, for example the new navigation in iOS 11. A month in on the new iOS, and an app made with RN looks already prehistorical.
The building/publication process is also incredibly slow compared to the time spent just coding the app, and in our experience a single component can break everything and slow down the process even more (for us, it was the DocumentPicker in Expo).
Anything else you would like to mention?
MemPa was born because “there are some passwords — Google, banks — that I never want to store, yet I always want to access.” If you’d like to read more about this problem, you can check out this post.
Moreover, if you’re passionate about password managers and you like MemPa's core idea, we’re looking for people to help with the development, even if you’re just getting started with RN. For this, or any other comments or suggestions, feel free to ping me at hello@mempa.io or @0x0ece.