When building MeetSpace, a video conferencing app for distributed teams, we faced a crucial decision: what tech stack would best suit our needs? After gathering requirements and reviewing our team's skillset, we opted for vanilla JavaScript, skipping front-end frameworks altogether. This approach allowed us to create a lightning-fast and lightweight web application that boasts impressive page loads and maintains ease of use.
Be Better
Our top priority was to build a superior video conferencing tool, addressing common issues like reliability, connectivity, call quality, speed, and ease of use. Our surveys revealed that users were eager for a seamless experience with low delay, high fidelity, and high reliability. We targeted Chrome and Firefox due to their WebRTC support, keeping our eyes on Safari and Edge for future development.
To achieve these goals, we focused on creating an application that keeps CPU and network usage extremely low. This ensures that even during network spikes, the call remains stable and doesn't drop or stutter. With this requirement in mind, using vanilla JavaScript allowed us to maintain control over the weight of our application, its boot speed, and idle CPU usage.
Small To Medium UX Needs
We created rough designs for all pages and took an inventory of interactions. These ranged from small to medium, with two pages being the most complex. Let's explore some examples:
Small: Link Copy
One example is a button to copy a link:
Here, we used a simple progressive enhancement pattern inspired by jQuery's plugins. On page load, we scan for a particular selector representing the component and enhance it with click-to-copy functionality.
Medium: Dashboard And Chat Pages
We identified two pages in the app with larger UX needs. For these, we considered using vanilla JavaScript, a small library, or a large framework. Our dashboard required live feedback on participant information within rooms, which we achieved through WebSockets. We pushed participant data to all clients when someone joins or leaves a room and updated the portraits accordingly.
By choosing vanilla JavaScript for swift app development, we were able to create an efficient, fast, and lightweight application that prioritizes user experience. With this approach, we can maintain control over our codebase, ensuring seamless interactions and exceptional performance.