ContentStack - Icanio Technology
To become the most trusted brand for undergrad students to empower them to enter the professional & academic world
Solution
Built their learning management and student workflow Management system to handle about 10000 students in 12 months.
Services
Web based services
Business Type
Enterprise
Location
Bangalore, Karnataka
Optimizing Contentstack: Automation Testing, React 18 Upgrade & Performance Enhancements
Contentstack is a headless content management system (CMS) that allows businesses to create, manage, and deliver content across a wide range of digital channels. Offering flexibility for developers through its API-first approach and intuitive tools for marketers, Contentstack is known for its ability to integrate with other platforms, scale effortlessly, and deliver superior digital experiences. However, even the most advanced platforms encounter challenges that need to be addressed for long-term success. Let’s explore how Contentstack tackled its performance bottlenecks, outdated technology, and test execution issues by implementing key optimizations to stay ahead in the digital content management game.
How We Enhanced Contentstack’s Performance with AI-Driven Testing & CMS Optimization
At its core, Contentstack provides a robust platform that simplifies content management for businesses and enterprises alike. But as the demand for seamless digital experiences increased, so did the pressure on Contentstack to optimize its infrastructure to provide smoother, faster, and more efficient performance.
One of the key challenges Contentstack faced was performance bottlenecks due to an outdated React platform. This limitation slowed down content delivery and made the platform less agile in handling large-scale operations. Additionally, inefficient test execution—caused by hardcoded values and module interdependencies—led to test failures, impacting the platform's reliability and deployment efficiency.
To resolve these challenges, we focused on three primary areas: Performance optimization, enhancing user experience, and improving testing efficiency.
One of the key challenges Contentstack faced was performance bottlenecks due to an outdated React platform. This limitation slowed down content delivery and made the platform less agile in handling large-scale operations. Additionally, inefficient test execution—caused by hardcoded values and module interdependencies—led to test failures, impacting the platform's reliability and deployment efficiency.
To resolve these challenges, we focused on three primary areas: Performance optimization, enhancing user experience, and improving testing efficiency.
Solving CMS Challenges: How Contentstack Upgraded Its Platform for Scalability & Efficiency
Upgrading to React 18: Enhancing Platform Performance
The first major step in optimizing Contentstack’s platform was the upgrade to React 18. React, one of the most widely used JavaScript libraries for building user interfaces, offers several improvements over its previous versions.
React 18 introduced concurrent rendering and automatic batching of updates, which significantly improved how the platform renders content. This allowed Contentstack to handle multiple content pieces, even on large-scale platforms, without sacrificing performance. The strict mode enhancements in React 18 also helped identify potential issues in the system early, which contributed to more efficient development and fewer errors down the line.
This upgrade resolved performance bottlenecks, allowing for faster page load times and smoother interaction with the platform. With this improvement, Contentstack was able to scale more effectively to meet the needs of its growing enterprise customer base.
React 18 introduced concurrent rendering and automatic batching of updates, which significantly improved how the platform renders content. This allowed Contentstack to handle multiple content pieces, even on large-scale platforms, without sacrificing performance. The strict mode enhancements in React 18 also helped identify potential issues in the system early, which contributed to more efficient development and fewer errors down the line.
This upgrade resolved performance bottlenecks, allowing for faster page load times and smoother interaction with the platform. With this improvement, Contentstack was able to scale more effectively to meet the needs of its growing enterprise customer base.
Implementing Localization and Interactive Features
The next optimization was focused on user experience. Contentstack’s visual editor, while functional, lacked essential interactive features that could make content management more intuitive. We introduced localization features within the Contentstack CMS, allowing users to tailor content for different regions and languages.
Additionally, we developed quick forms and discussion modules within the platform, providing marketers, content creators, and users with easy ways to interact, provide feedback, and manage content more efficiently. These interactive modules were designed to ensure a seamless content creation and review process, improving user engagement.
By enhancing these interactive features, we improved how users interacted with the platform, which directly contributed to a more user-friendly and efficient content management system.
Additionally, we developed quick forms and discussion modules within the platform, providing marketers, content creators, and users with easy ways to interact, provide feedback, and manage content more efficiently. These interactive modules were designed to ensure a seamless content creation and review process, improving user engagement.
By enhancing these interactive features, we improved how users interacted with the platform, which directly contributed to a more user-friendly and efficient content management system.
From Bottlenecks to Breakthroughs: Contentstack’s Journey to a High-Performance CMS
Optimizing Test Execution with Automation
One of the most crucial areas for optimization was test execution. The previous test framework used in Contentstack had its own set of limitations, particularly due to the use of hardcoded values and module interdependencies, leading to inconsistent test results. Additionally, the tests were not optimized for parallel execution, which slowed down the overall testing process.
To address this, we completely re-engineered the test framework using Java and Selenium, allowing us to introduce explicit waits and eliminate hardcoded values by retrieving them from properties files. We also implemented parallel test execution, which drastically improved testing efficiency. This change not only sped up the testing cycle but also enhanced the overall accuracy and reliability of test results.
By optimizing the testing process, we were able to ensure that every feature, from content management to platform interactions, was thoroughly tested for quality and performance. This move significantly improved the deployment timeline and ensured that updates were released with fewer bugs and greater reliability.
To address this, we completely re-engineered the test framework using Java and Selenium, allowing us to introduce explicit waits and eliminate hardcoded values by retrieving them from properties files. We also implemented parallel test execution, which drastically improved testing efficiency. This change not only sped up the testing cycle but also enhanced the overall accuracy and reliability of test results.
By optimizing the testing process, we were able to ensure that every feature, from content management to platform interactions, was thoroughly tested for quality and performance. This move significantly improved the deployment timeline and ensured that updates were released with fewer bugs and greater reliability.
Contentstack 2.0: React 18, Parallel Testing, and Scalable Performance Upgrades
Final Thoughts: A Scalable, Efficient CMS
The improvements made to Contentstack transformed it into a highly scalable and efficient content management system capable of handling the increasing demands of enterprise customers. The React 18 upgrade enhanced performance and ensured that the platform could scale seamlessly. The localization features and interactive modules improved the overall user experience, making it easier for teams to create and manage content efficiently.
Moreover, the automation testing improvements, including parallel execution and better framework structure, reduced testing time and improved accuracy, ensuring that updates and new features were deployed more quickly and with fewer issues.
In conclusion, Contentstack's journey to optimize its platform has not only improved its performance but also strengthened its position as a leader in digital experience management. These upgrades allowed Contentstack to provide an enhanced user experience, faster content delivery, and better scalability for businesses looking to stay competitive in the digital space.
Moreover, the automation testing improvements, including parallel execution and better framework structure, reduced testing time and improved accuracy, ensuring that updates and new features were deployed more quickly and with fewer issues.
In conclusion, Contentstack's journey to optimize its platform has not only improved its performance but also strengthened its position as a leader in digital experience management. These upgrades allowed Contentstack to provide an enhanced user experience, faster content delivery, and better scalability for businesses looking to stay competitive in the digital space.
Project Introduction
It is an EdTech Startup based out of Bangalore. They are primarily in the higher education space and provide students with preparatory courses for competitive exams like GMAT, GRE, IELTS and TOEFL. In addition, they also assist students with profile building and admissions consulting activities that could make their study abroad application stronger. The brand was delivering these courses on an SD Card that would operate in a specific application on a tablet.
- Since that added to their overheads, the organisation wanted to create a custom Learning Management System that would host their course content.
- In addition, they also had a lot of data on their students which they would use to manage the student workflow.
- Hence, they also wanted a platform that could help them simplify their workflow processes.
What we have received from client
- Learning Management System to host video content, quizzes and student journey.
- Data Management Portal to capture student data and manage the various stages of the student journey.
The teams needed were as follows
The various users used this platform
End Users
Students and clients - These would be the people who are consuming the content and attempting the quizzes on the portal and the platform.
Admin Users
Operations Teams, Associates, Mentors and Teachers - These would be the people who are managing the student journey. They are mainly from the Operations and Customer Support Team.
Super admin Users
Operations Teams, Associates, Mentors and Teachers - These would be the people who are managing the student journey. They are mainly from the Operations and Customer Support Team.
Challenges & Solutions
KEY CHALLENGES
SOLUTIONS
The requirements for the Data Management System
kept changing from time to time.
Set up a strict Agile Project Management System and educate all the stakeholders about the same so that the requirements are more streamlined.
Since the content was for test preparation, the
student journey could be perceived as long, boring and uninteresting.
student journey could be perceived as long, boring and uninteresting.
The Learning Management System tried to gamify the experience by providing various levels and by including an interactive UI.
The logic of the GMAT and GRE scoring system was unique and was not readily available to be replicated.
Regular brainstorming sessions were conducted with Academic Experts and Product Managers to break down the logic and a similar logic was built for the tests.
KEY CHALLENGES
The requirements for the Data Management System
kept changing from time to time.
Since the content was for test preparation, the
student journey could be perceived as long, boring and uninteresting.
student journey could be perceived as long, boring and uninteresting.
The logic of the GMAT and GRE scoring system was unique and was not readily available to be replicated.
SOLUTIONS
Set up a strict Agile Project Management System and educate all the stakeholders about the same so that the requirements are more streamlined.
The Learning Management System tried to gamify the experience by providing various levels and by including an interactive UI.
Regular brainstorming sessions were conducted with Academic Experts and Product Managers to break down the logic and a similar logic was built for the tests.
Learning Management System (LMS)
Setting Up
The student first enters personal information and the details regarding the proposed date on which the test will be taken.
Goal Setting
Additional details such as dream score, target college and the timeline are captured.
Personalized Plan
Then the platform customises the study plan based on the inputs given by the student.
Learning Phase
The student watches the concept videos and takes the topic test.
Practice & Reinforcement
The student then practises further using drill and question bank questions.
Performance Tracking
The LMS tracks the performance of the student on each of the sections and gives inputs accordingly.
Reporting & Monitoring
Teachers and mentors will be able to pull out student performance and progress reports at the backend.
Data Management Portal
Profile Setup
The student enters personal information and preferences.
Student Onboarding
The student then attends the onboarding process on the portal.
Schedule a Mentor Call
Once the onboarding is done, the student then schedules a call with the mentor using the calendar option on the portal.
Post - Call Review
Post-call reports and summaries can be seen in the portal.
Back end Reporting
Managers and Operations Associates will be able to pull our stage-wise and student performance reports at the backend.
Managing a large-scale student cohort: The impact of LMS and data management portal
5000
Total Students
92%
Overall CSAT
81%
Overall NPS
Office Locations
Development
Centre
Centre
Nazareth
Selvan's Complex, 203,
Margoschis Road, Nazareth,
Tamil Nadu 628617
Margoschis Road, Nazareth,
Tamil Nadu 628617
Development
Centre
Centre
Tirunelveli
Selvan's Complex, 203,
Margoschis Road, Nazareth,
Tamil Nadu 628617
Margoschis Road, Nazareth,
Tamil Nadu 628617
Development
Centre
Centre
Chennai
NO. 07, Kumaran Nagar, 200 Feet Radial Road,
Zamin Pallavaram, Chennai,
Tamil Nadu - 600117
Zamin Pallavaram, Chennai,
Tamil Nadu - 600117
Office Locations
US Office
United States
2093 Philadelphia, Pike,
#5056 Claymont,
DE 19703, United States
#5056 Claymont,
DE 19703, United States
Singapore Office
Singapore
101 Cecil Street,
#20-11 Tong Eng Building,
Singapore 069 533.
#20-11 Tong Eng Building,
Singapore 069 533.
Development
Centre
Centre
Nazareth
13, Agapaikulam 8th Street
Sathankulam Road, Nazareth,Tuticorin,
Tamil Nadu 628617
Sathankulam Road, Nazareth,Tuticorin,
Tamil Nadu 628617
Development
Centre
Centre
Tirunelveli
AP Towers No. A16, NGO 'A' Colony,
North Main Road, Tirunelveli,
Tamil Nadu - 627007
North Main Road, Tirunelveli,
Tamil Nadu - 627007
Development
Centre
Centre
Chennai
NO. 07, Kumaran Nagar, 200 Feet Radial Road,
Zamin Pallavaram, Chennai,
Tamil Nadu - 600117
Zamin Pallavaram, Chennai,
Tamil Nadu - 600117
Singapore Office
Singapore
101 Cecil Street,
#20-11 Tong Eng Building,
Singapore 069 533.
#20-11 Tong Eng Building,
Singapore 069 533.
Development
Centre
Centre
Nazareth
Selvan's Complex, 203,
Margoschis Road, Nazareth,
Tamil Nadu 628617
Margoschis Road, Nazareth,
Tamil Nadu 628617
Development
Centre
Centre
Tirunelveli
AP Towers No. A16, NGO 'A' Colony,
North Main Road, Tirunelveli,
Tamil Nadu - 627007
North Main Road, Tirunelveli,
Tamil Nadu - 627007
Development
Centre
Centre
Chennai
NO. 07, Kumaran Nagar, 200 Feet Radial Road,
Zamin Pallavaram, Chennai,
Tamil Nadu - 600117
Zamin Pallavaram, Chennai,
Tamil Nadu - 600117
Icanio Technologies aims to be the solution to any of your tech problems and a stepping stone to your digital transformation. Talk to us to find out how we have helped our clients become successful and we are sure you will also want to work with us.
United States : (+1) 302 480 9804
India : (+91) 63791 67118