Homepage

Marionette: Plain Object over Reqres, Commands Above All!

A brief introduction to Marionette’s reqres (request-response) and commands would be that they are application (or module) level event aggregators that either return a value or cause an action to happen.

A brief introduction to Marionette’s reqres (request-response) and commands would be that they are application (or module) level event aggregators that either return a value or cause an action to happen. Both provide similar api to execute and set handlers:

tsx

There is one more significant difference between the two - request-response is synchronous, while commands are not.

Plain Object vs the Reqres

Come to think about it - if requests are synchronous, is there anything more to reqres than just a fancy API to call good ol' function? Let's write a (simple) piece of code twice to compare them.

With Marionette.request

tsx

We set up a posts module that is responsible for keeping our posts in place; then we register a 'post:get' handler that will return an object containing all the data that the app needs. The post gets requested later in the app, which executes handler code and return post's details. Now, the very same code, but using a plain object instead of module with reqres.

With JS Object

tsx

Couple of things come to mind, first being: hell, the second piece of code just looks better. It'd be hard to disagree that reqres syntax is somewhat unwieldy and convoluted, while plain objects are much simpler and straightforward. There are also some less visible benefits:

  • The request call looks a lot like an event call - but it works differently, I don't have to tell you, that this is not a desired effect

  • Plain objects are also easier to test, since you can test them in isolation not only from your application code, but also the framework

  • Reqres API has no way of scoping requests or creating hierarchy, you need to rely on fragile naming conventions

On the flipside reqres API may nicely align with events, channels and commands that are likely to be all over the place.

Other than that - both approaches are nearly identical. They are synchronous, global, decoupled and allow only one handler per request type ( both also fail silently when overwriting previous handler). Ha, i just used global and decoupled in one sentence! It's fine though, our modules need to talk to each other. What may be a tipping point (it was for me) is fact the reqres is more error prone. Typos are real, people, and request will just silently fail if no handler is found. Contrast it with plain object that will come at you screaming if you as much as try calling an undefined function.

Commands Prevail

With all that above, you are probably thinking that I'm going to be mean to commands, too. Commands are actually quite awesome, mostly due to the fact, that they can't be easily replaced by a javascript object since they are asynchronous. They still have inherited some of problems that reqres suffers from, like silent fails, slightly harder testing and general flatness (as in no grouping). You might think about dropping commands API for vents, also avaiable in Marionette, but this:

tsx

isn't at all improvement to that:

tsx

Second version is of course more concise and readable.

Marionette <3

Although I gave Marionette a rough time, you shouldn't get discouraged. The apis are just a minor part of the framework and the dificulties you might have with them are vastly outweighted by all the awesomeness Marionette brings to the table. At Naturaily we love and cherish Marionette and believe it to be the best of libraries built on top of Backbone and maybe even the very best framework for single page applications available.

Let’s Create a Great Website Together

We'll shape your web platform the way you win it!

More posts in this category

  • February 05, 2025 • 10 min read

    API-first CMS: What Options You Have (Web Dev Agency's Take)

    According to the 2024 State of the API Report by Postman, 74% of organizations are adopting API-first strategies. This statistic isn’t just impressive—it signals a major shift in how businesses operate. While API-first approaches have long been a staple in software development, they're now reshaping content management as well. More and more companies are realizing that traditional CMS platforms can't keep up with the demand for flexibility, speed, and seamless integrations.

    READ MORELearn more about api first cms
  • January 23, 2025 • 15 min read

    Best CMS for SaaS: Top Cloud-Based Solutions

    Choosing the right Content Management System (CMS) is a critical decision for your SaaS business. Your unique needs require solutions that are not only flexible, scalable, and user-friendly but also tailored to meet the demands of a fast-paced, customer-focused industry. A CMS should simplify your workflows and help you deliver personalized, high-quality digital experiences.

    READ MORELearn more about best cms for saas top cloud based solutions
  • December 12, 2024 • 10 min read

    We Picked the Best (Headless) CMS for Vue

    Picture a digital experience where content effortlessly flows across platforms, development is agile, and performance is unmatched. By combining the power of Vue.js, a progressive JavaScript framework, with a modern headless CMS, you can achieve all this and more.

    READ MORELearn more about headless cms for vue