A little more than a year ago, Sam Eigen (Loper’s CTO) was in a meeting with our designer going through a new feature that was going to be the most dynamic and information dense screen Loper had ever built for our app. This wasn’t simply a screen with some graphs and counters. We certainly had stats to display, but the screen was also packed with college and personality quiz recommendation lists, saved school previews, gamification badges, and a variety of information (including embedded YouTube videos) to help users find what’s most relevant to them as quickly as possible. On top of that, this was going to be the first screen our users would see when they enter Loper.
That week, we were asking ourselves: how do we query this much information that’s unique to a specific user in an efficient manner to feed the UI we need to render for the user? We kicked around the usual suspects: massively paralleled REST calls with caching, GraphQL, UI tricks to fake performance, etc. At that time, we were using a classic AWS Lambda + RDS implementation; Tanstack to handle our query states with overall good performance that was heavily reliant on caching. We had a standard React Native implementation on top of the AWS ecosystem. There were a number of shortcomings we identified with our current stack when looking at what it would take to build out this new screen with so many features. We needed to think outside the stack… outside our existing paradigm.
The solution was a complete shift in the way we related to data: instead of imperative data fetching, declarative sync via PowerSync. I admit, before we discovered PowerSync, we (very briefly) toyed with the idea of attempting to build a sync engine on top of our existing AWS paradigm. Thankfully, we discovered PowerSync early in our planning stage, and the learning for implementing PowerSync in React Native was minor.
This was a radical shift in the way we thought about mobile app development. Suddenly, all of the data we wanted to make available to the client was directly and immediately available within our app. We also learned that PowerSync’s SQLite implementation supported JSON functions, which opened the door to extending our data far beyond our existing data structures. Within a few weeks, we had a fully functioning feature ready to start internal testing… Yes, it really is that quick to get PowerSync set up and going in a React Native project!
How sync opened the door to AI + RAG
After we completed our first PowerSync integration, we had another realization: we could level up our existing college matching algorithm using AI + RAG processes that take much longer than the performance you need with REST API calls and UI performance tricks! Our existing matching algorithm was already comprehensive, but we knew we could do better now that we had the ability to sync data to the client instantly. PowerSync has a %%watchWithCallback%% function (and recently added differential watch queries) as part of their SDK that would allow us to drive truly real-time interactions with our users!
PowerSync allowed us to increase the amount of server resources driving our recommendations by a long shot! We no longer had to cherry pick a score of matching attributes to keep query performance as optimized as possible. We have upwards of 22 user onboarding data points augmented by 200-300 interests the user interacts with in our app that need to be matched and scored across more than 500 data points we have on each college. We could now build an AI + RAG process that would run for as long as is needed to make the best matches between so many data points. If a match took more than 30 seconds (our average is roughly 28 seconds of runtime), it wouldn’t impact the user’s experience.
Thanks to the instant sync now available in-app, we now provide our users with a seamless and hyper-personalized recommendation experience without our users having long wait times. Our users continue using every feature in Loper all while receiving tailored college recommendations in real-time from long-running AI + RAG processes. Additionally, each college recommendation is coupled with specific details about exactly why the user matched with that specific college. This way, the user knows exactly why a given college is a fit just for his/her needs and preferences. Two users with the same onboarding profile won’t always match to the same colleges because there are 200-300 other data points distinguishing each user’s interests from another. It’s hyperpersonalization at scale. To date, we’ve delivered over 1.3MM recommendations to nearly a quarter million users based upon nearly 7.5MM user preference data points, and we’re working on further deepening the level of hyperpersonalization to include more relationships and data.
Loper Demo Video
In the video below you can see the background AI + RAG in action. A user uses a “Super Like” on computer science programs as an area of study, and gives physics programs a like as well. They continue to use other areas of the app while these new preferences are sent to the server. There, they’re combined with 200+ other user preference data points in a server-side AI + RAG process that has time to make the best college matches. When the process completes, the result is immediately synced to the user in the form of a new recommendation (in this case for the Illinois Institute of Technology). This flow is designed to keep the user engaged (and logging preferences) while college matching processes run in the background.
About Loper
Loper is a free college search and planning app built to help students explore their post–high school options in a more personalized, engaging way. Students can explore their interests and college life through a social media style feed, get personalized college recommendations, easily build and manage their lists, and access free resources that make it easier to stay on top of applications and apply confidently. For counselors and college partners, Loper creates more meaningful touchpoints with students by turning a traditionally overwhelming process into something simple, visual, and actionable.