JSFoo 2019

On component architecture, front-end engineering and Developer Experience (DX)


Backbone => Vue: Adding modern frameworks to legacy codebases

Submitted by Bharat Kashyap (@bharatkashyap) on Friday, 30 August 2019

Section: Crisp talk (20 mins) Technical level: Intermediate Status: Confirmed


All large projects of our time began life as small codebases written in frameworks that are now almost obsolete. How should organisations go about introducing modern frameworks into these “legacy” codebases; and is doing this effort worth taking at all?


The web development world looked a lot different at the beginning of this decade. Full stack development was seeing its origins, with a number of JavaScript frameworks being developed for both front and back end use. A number of the large software companies around us today - AirBnb, Uber, Hulu - built the first versions of their products on such frameworks. These frameworks – one of which was Backbone.js – look very different from the frameworks most of us are used to. Built during a time of an extremely limited JavaScript, these frameworks did not evolve at the same rate over this past decade as JavaScript. Cut to 2019, even though they retain their place in very large codebases, there are very few developers comfortable writing code in them; they slow down parts of the application, feature building and debugging – just because it is difficult to introduce newer, modern frameworks into such legacy codebases. We performed a similar experiment in our own application – of introducing Vue to a very large application writtin in Backbone.js – and learned a lot in the experience. The aim will be to lightly outline how we implemented this mixed migration, and what specific benefits we observed in the process.

Speaker bio

I’m a frontend engineer at Atlan, a data democratisation startup operating out of Delhi. I have frontend experience with SocialCops, where I worked on large projects undertaken by the Government of India and the United Nations, among others.





  •   Zainab Bawa (@zainabbawa) Reviewer 6 months ago

    Thanks for the submission, Bharat. This case study sounds interesting. I’d like more details on this part that you mentioned in your proposal: ‘The aim will be to lightly outline how we implemented this mixed migration, and what specific benefits we observed in the process.
    My specific questions here are:

    1. What was the imperative for modernization in Atlan’s case?
    2. Why was Vue chosen as the framework for migration? WHat other choices were considered and compared before deciding on Vue?
    3. What was the situation like with Backbone and how is the situation after Vue implementation? Explain details about the before-and-after situation by showing metrics and data points.

    I also reviewed your slides. They are indeed light. :) Here is the feedback on your slides:

    1. The introduction slides are redundant in the sense that participants at JSFoo will know the evolution of JS. Spending three slides on this part is an over-kill.
    2. Instead, you have to help participants understand Atlan’s context, your app and why was there this need to move from legacy codebase to a modern framework?
    3. You have mentioned performance and developer experience as the two factors that pushed to modernization. But there is no context about these aspects with respect to Atlan. What I mean to say is that you have to add more context about performance and developer experience in backbone (and related to Atlan’s business logic) that were posing challenges, and which caused you to move to Vue.

    Confirming your talk for the conference. Revise your slides and pitch, incorporating the above feedback and submit by 9 September.

Login with Twitter or Google to leave a comment