Need advice about which tool to choose?Ask the StackShare community!
Stimulus vs jQuery: What are the differences?
Introduction
This Markdown code provides a comparison between Stimulus and jQuery, highlighting their key differences in a concise manner.
Syntax and Structure: Stimulus uses a simple and declarative HTML syntax where data-action attributes are used to define behavior and data-target attributes are used to select elements. On the other hand, jQuery primarily relies on CSS-style selectors to manipulate elements and attach event handlers.
Size and Performance: Stimulus is a lightweight JavaScript framework that focuses on providing structure and enhancing interactivity without adding unnecessary bloat to the codebase. It has a smaller footprint and better performance compared to jQuery, making it a preferable choice for modern web applications.
Code Organization and Maintainability: Stimulus encourages developers to follow a component-based approach, allowing for better code organization and modularity. It promotes writing isolated and reusable components, which enhances code maintainability and makes it easier to work collaboratively. In contrast, jQuery code tends to be more procedural and can lead to spaghetti code if not organized properly.
AJAX and Server Interactions: jQuery provides extensive support for AJAX and server interactions, with a wide range of helper methods and options for making HTTP requests and handling responses. Stimulus, however, does not include built-in AJAX functionality and encourages developers to use other libraries or frameworks specifically designed for these tasks, such as Axios or Fetch API.
DOM Manipulation vs. Controllers: jQuery is primarily designed for DOM manipulation and provides a rich set of methods for selecting, modifying, and manipulating elements on the page. Stimulus, on the other hand, focuses on providing reusable controller classes that encapsulate behavior and allow for more fine-grained control over application logic. It abstracts away low-level DOM manipulation and provides a more structured approach to building interactive UI components.
Browser Compatibility: jQuery has a long history and extensive cross-browser compatibility, making it a reliable choice for a wide range of projects. Stimulus, being a newer framework, has better compatibility with modern browsers. Though it can be used in older browsers with the help of polyfills, its primary focus is on providing a modern and future-proof development experience.
In summary, Stimulus offers a lightweight, component-based approach to building web applications, focusing on code organization, maintainability, and modern development practices. jQuery, on the other hand, is a more traditional and feature-rich library that excels in DOM manipulation and supports a wide range of browsers.
Starting a new company in 2020, with a whole new stack, is a really interesting opportunity for me to look back over the last 20 years of my career with web software and make the right decision for my company.
And, I went with the most radical decision– which is to ignore "sexy" / "hype" technologies almost entirely, and go back to a stack that I first used over 15 years ago.
For my purposes, we are building a video streaming platform, where I wanted rapid customer-facing feature development, high testability, simple scaling, and ease of hiring great, experienced talent. To be clear, our web platform is NOT responsible for handling the actual bits and bytes of the video itself, that's an entirely different stack. It simply needs to manage the business rules and the customers experience of the video content.
I reviewed a lot of different technologies, but none of them seemed to fit the bill as well as Rails did! The hype train had long left the station with Rails, and the community is a little more sparse than it was previously. And, to be honest, Ruby was the language that was easiest for developers, but I find that most languages out there have adopted many of it's innovations for ease of use – or at least corrected their own.
Even with all of that, Rails still seems like the best framework for developing web applications that are no more complex than they need to be. And that's key to me, because it's very easy to go use React and Redux and GraphQL and a whole host of AWS Lamba's to power my blog... but you simply don't actually NEED that.
There are two choices I made in our stack that were new for me personally, and very different than what I would have chosen even 5 years ago.
1) Postgres - I decided to switch from MySql to Postgres for this project. I wanted to use UUID's instead of numeric primary keys, and knew I'd have a couple places where better JSON/object support would be key. Mysql remains far more popular, but almost every developer I respect has switched and preferred Postgres with a strong passion. It's not "sexy" but it's considered "better".
2) Stimulus.js - This was definitely the biggest and wildest choice to make. Stimulus is a Javascript framework by my old friend Sam Stephenson (Prototype.js, rbenv, turbolinks) and DHH, and it is a sort of radical declaration that your Javascript in the browser can be both powerful and modern AND simple. It leans heavily on the belief that HTML-is-good and that data-* attributes are good. It focuses on the actions and interactions and not on the rendering aspects. It took me a while to wrap my head around, and I still have to remind myself, that server-side-HTML is how you solve many problems with this stack, and avoid trying to re-render things just in the browser. So far, I'm happy with this choice, but it is definitely a radical departure from the current trends.
I have made an extended effort to drop frameworks completely if they are not actually needed. While I still use JS Frameworks like Vue, Angular and React ( if I have too ), I see far too often devs / teams deciding to build a single page site entirely in a framework, rather than just using HTML, CSS and a little JS.
I personally feel it's important to know when a framework is a good solution, and maybe when it's overkill.
The project is a web gadget previously made using vanilla script and JQuery, It is a part of the "Quicktext" platform and offers an in-app live & customizable messaging widget. We made that remake with React eco-system and Typescript and we're so far happy with results. We gained tons of TS features, React scaling & re-usabilities capabilities and much more!
What do you think?
I've an eCommerce platform building using Laravel, MySQL and jQuery. It's working good and if anyone become interested, I just deploy the entire source cod e in environment / Hosting. This is not a good model of course. Because everyone ask for small or large amount of change and I had to do this. Imagine when there will be 100 separate deploy and I had to manage 100 separate source. So How do I make my system architecture so that I'll have a core / base source code. To make any any change / update on specific deployment, it will be theme / plugin / extension based . Also if I introduce an API layer then I could handle the Web, Mobile App and POS as well ? Is the API should be part of source code or a individual single API and all the deployment will use that API ?
When I started TipMe, I thought about using React frontend. At the end, plain, simple jQuery won.
I had to build this iteration of the site fast and by using jQuery I could keep using Django as a full stack development tool. One important point is Django form (combined with Django Bootstrap3) means that I don't have to reinvent form rendering again, which will be the case with React.
Over time, more interactivity seeped into the site and React components start making its way into the codebase.
I now wish the site is built using React so that I could add more user friendly interfaces easier (no more fuddling with server states) but I would still say jQuery helped me get past those early days.
Pros of jQuery
- Cross-browser1.3K
- Dom manipulation957
- Power809
- Open source660
- Plugins610
- Easy459
- Popular395
- Feature-rich350
- Html5281
- Light weight227
- Simple93
- Great community84
- CSS3 Compliant79
- Mobile friendly69
- Fast67
- Intuitive43
- Swiss Army knife for webdev42
- Huge Community35
- Easy to learn11
- Clean code4
- Because of Ajax request :)3
- Powerful2
- Nice2
- Just awesome2
- Used everywhere2
- Improves productivity1
- Javascript1
- Easy Setup1
- Open Source, Simple, Easy Setup1
- It Just Works1
- Industry acceptance1
- Allows great manipulation of HTML and CSS1
- Widely Used1
- I love jQuery1
Pros of Stimulus
- No Javascript on Backend5
- Simple and easy to start with5
- Balance between Front End and BackEnd4
- Easy way to add functionality to rails views2
Sign up to add or upvote prosMake informed product decisions
Cons of jQuery
- Large size6
- Sometimes inconsistent API5
- Encourages DOM as primary data source5
- Live events is overly complex feature2
Cons of Stimulus
- Steep learning curve2