DEV Community

Cover image for The Renaissance of Meteor.js
Gabs Ferreira for Meteor

Posted on

The Renaissance of Meteor.js

January 20, 2012. That's the date of the initial release of Meteor.js.

Back then, the web was a very different place.

Front-end development was dominated by jQuery for cross-browser compatibility and DOM manipulation.

Responsive design was gaining traction, with Bootstrap standardizing mobile-friendly web design.

Single-page applications were emerging, with AngularJS leading the way due to its two-way data binding and modular structure.

On the backend, Node.js was in its early stages, and JavaScript was growing in popularity as a server-side language, allowing for unified development on both client and server sides. Technologies like PHP, Ruby on Rails, and Java were prevalent, each with its ecosystem.

RESTful APIs were transforming web services, moving away from the older SOAP protocol.

Tools like Docker and Kubernetes didn't exist, making deployment and scaling cumbersome. Developers relied on virtual machines and manual configuration, which were time-consuming and prone to errors. CI/CD pipelines were very basic, often involving custom scripts and manual steps.

Cloud computing was in its early days, with AWS gaining traction but not yet reaching its current level. Organizations still hesitated to move to the cloud due to security and reliability concerns.

The software development landscape rapidly evolved with new frameworks and libraries, but the ecosystem needed to be more mature and integrated than today, making it more fragmented and rapidly changing for developers.

The rise of the framework

In this fragmented and constantly evolving environment, Meteor.js was launched and quickly gained the attention of the mainstream dev community.

Creating a project with it meant you would have an out-of-the-box framework with everything you need to create reactive applications with few or almost no plumbing. It was a unified architecture on top of Node.js that bundled client, server, and database all in one package so you could easily run and deploy reactive real-time apps.

And it was a success.

As time went by, Meteor.js grew in popularity with its community. We had meetups and conferences all over the world, and thousands of different people worked on packages and projects based on Meteor.js.

But at some point, we got stuck

A big part of what made Meteor.js great was Fibers: a key concept in how we handled asynchronous code in a way that appears synchronous, making the code easier to write and read.

The problem is that the way it worked depended a lot on Node.js, and the moment they decided to introduce asynchronous handling directly on the framework, Fibers wouldn't make sense anymore.

And that happened in 2021.

Replacing Fibers and bringing Meteor to the mainstream again

In the beginning, removing Fibers from the framework seemed like a very hard task.

And, well… it was harder than we had imagined.

During the past 3 years we did a lot of planning, coding and had uncountable discussions with the community to figure out what would be the best way of handling this. And of course, we broke (and fixed) a good amount of stuff in this process.

But we made it.

Removing Fibers was a critical step in bringing Meteor up to date with the most current Node.js stack. This transition allows Meteor to leverage all the new features that Node v20 provides. Async/await, a feature now fully supported in Meteor 3, is a prime example.

Example of Async/Await in Meteor:

Meteor.methods({
  async getUserData(userId) {
    try {
      const user = await UsersCollection.findOneAsync({ _id: userId });
      return user;
    } catch (error) {
      throw new Meteor.Error('user-fetch-failed', 'Could not retrieve user data');
    }
  }
});
Enter fullscreen mode Exit fullscreen mode

This example demonstrates how you can fetch user data asynchronously. Using async/await ensures the code is clean and easy to read, and error handling is straightforward.

Meteor 3 and Node v20

Meteor.js 3 now supports Node.js 20 and with it, you can leverage its unparalleled speed of product development and access not only modern syntax but a whole universe of compatibility with Node.js tooling and security.

Node v20 brings several enhancements that Meteor utilizes to improve performance and developer experience. These include Top-Level Await and Timers Promises API!

Top-Level Await

Allows using the await keyword outside of async functions within modules, simplifying the initialization of applications.

// At the top level in your Meteor app's server-side code
const settings = await SettingsCollection.findOneAsync({ key: 'app-config' });
Meteor.startup(() => {
  configureApp(settings);
});
Enter fullscreen mode Exit fullscreen mode

This feature allows developers to perform asynchronous operations before the application fully starts, ensuring that necessary configurations are in place.

Stable Timers Promises API

Provides a promise-based alternative to traditional timer functions like setTimeout and setInterval, enhancing the way delays and periodic tasks are handled in a non-blocking manner.

import { setTimeout } from 'timers/promises';

Meteor.methods({
  async delayedGreeting(name) {
    // Wait for 2 seconds before continuing
    await setTimeout(2000);

    // Process after the delay
    return `Hello, ${name}!`;
  }
});
Enter fullscreen mode Exit fullscreen mode

Integrating Express into Meteor

Image description

The adoption of Express in Meteor.js 3 opens up new possibilities for developers, especially when building RESTful APIs or serving static files. Express is a minimal and flexible Node.js web application framework that provides a robust set of features for web and mobile applications.

Here is an example of using the WebApp.handlers as your express instance as you typically would:

import { LinksCollection } from "/imports/api/links";
import { WebApp } from "meteor/webapp";

WebApp.handlers.get("/all-links", async (req, res) => {
  const links = await LinksCollection.find().fetchAsync();
  res.json(links);
});
Enter fullscreen mode Exit fullscreen mode

In this example, express is used to define a simple API endpoint that returns data from a Meteor collection. This setup shows how seamlessly Express can integrate into the Meteor ecosystem, providing familiar tools for those accustomed to traditional Node.js development.

You can read more about Meteor with Express here!

The Renaissance

We are very proud of this release, and want to invite you to an online event with members of the Meteor Core Team to talk about everything we’ve been working on and our plans for the future!

Image description

It will happen from July 29th to August 1st. On each day, we’ll do live streams at 1 pm (GMT-3) simultaneously on YouTube, LinkedIn, Twitch, and X.

Subscribe here to be notified about the event and participate in the Meteor SWAG and Galaxy credits giveaway!

Here’s the event schedule:

July 29th
The State of Meteor.js in 2024 - A deep dive into what the Meteor core team members have been working on to release this major version. From the compatibility with the latest Node.js features, including version 20 LTS, and moving from Fibers to native async/await syntax.

July 30th
Understand the potential of the platform - Discover what the coolest features of Meteor.js are, what you create with it, and its advantages compared to other platforms and frameworks.

July 31th
Built with Meteor.js: Galaxy Cloud - Join us as we chat with the developers of the biggest Meteor.js successful project: Galaxy, a cloud service provider that ofers a variety of different products and has hundreds of satisfied customers.

August 1st
Chat with the Meteor.js team - Q&A session with members of the Meteor.js Core Team hosted inside Meteor Lounge, our official Discord Server.

We’re very excited about this and I hope to see you all there!

Top comments (0)