Call Us Today! 619-884-2250

Digital marketing agency driven by results.
Finally a web company that sticks to their word.

You can now can install Joomla 4 on your localhost and see all the major differences compared to Joomla 3.

And it has some amazing improvements.

This article will show you 11 significant differences between Joomla 4 and Joomla 3. We hope after 5 minutes of reading, you can decide whether or not updating to this latest version is for you.

Let’s take a closer look!

Bootstrap 2 vs Bootstrap 4

Bootstrap is a free front-end framework that helps web development process much faster and easier.

Particularly, Bootstrap plays a vital role in easily creating responsive designs. And the latest version - Bootstrap 4 is integrated with Joomla 4 instead of keeping Bootstrap 2 in Joomla 3. You can see the new front-end template’s user interface is much improved.

See all the differences from a technical aspect.

b2ap3 large bootstrap 4


They are all-powerful CSS extensions in programming languages that make the code cleaner, development process faster and better organized.

- Joomla 3: uses Bootstrap 2, so it was developed with LESS (Leaner Style Sheets) which is a major improvement from a few years ago. LESS is based on JavaScript.

- Joomla 4: is updated in Bootstrap 4, then the version use SASS (Syntactically Awesome Stylesheets) based on Ruby.

Overall, both can do a great job as a CSS extension. However, with SASS being much more popular than LESS nowadays, and more powerful according to many experienced developers Joomla 4 seems to be in good hands.

3. Better responsiveness

Designing websites following the mobile-first rule or with the responsive layout is a must nowadays when mobile devices take up more than 50% of total web traffic. With Joomla 4, the responsive layout is developed with the latest technology.

Joomla 3: has the responsive layout grid system but actually, users are not satisfied with it. Users have some difficulties in implementing the design as well as not knowing how to tune the width of the columns in the grid.

Joomla 4: uses the CSS Grid to replace the 12 column layout system. The change not only makes the development process easier but also significantly improves the responsiveness of your site.

b2ap3 large Responsive joomla 4 vs Joomla 3

4. Default front-end template

Comparing the two pictures below, you might agree that the Joomla 4 front-end design has a cleaner and more elegant look than the old one version

Joomla 3: has 2 front-end templates which are Beez3 and Protostar.

b2ap3 large Joomla 3 frontend template

Joomla 4: has only Cassiopeia as the front-end template in which the user interface is developed based on Bootstrap 4 and the layout is developed based on CSS Grid.

b2ap3 large Joomla 4 front end template cassiopeia



5. Default backend template

The back-end interface has been changed in Joomla 4. The big improvement is the position of the menu. Instead of keeping the horizontal menu, Joomla 4 has switched the menu vertically.

Joomla 3: has 2 back-end templates which are Hathor and Isis.

b2ap3 large 2

Joomla 4: has a new back-end template named Atum which comes with great improvements in the user interface and some interesting features like the new publishing workflow.

b2ap3 large back end joomla 4 pic

6. More simplified Installation process

Joomla 4’s installation process is more simplified than Joomla 3.x’s

Joomla 3: includes 3 steps - main configuration, configure database, and overview.
Joomla 4: Although the version still has 3 steps as before, this improvement will help users to look back on previous information without interrupting the installation process and having to submit again if they want to modify something.
As you can check from the Github process, the Joomla team plans to add the feature which lets you install the extensions (at minimum core supported extensions) along with the Joomla 4 installation.

b2ap3 large install 7

7. Media Manager with editing feature

The Joomla team has noticed the pain points of users in the previous version when it comes to the media manager. The feature had absolutely no editing function at all. A strange phenomenon when we are living in 2019.

However, Joomla 4 now has a “smart innovation” in Media. It is integrated with editing features which will be more useful for you to upload pictures. Besides, you can read the properties of each photo by clicking on the picture.

Joomla 3: have limited functions such as no editing feature included that requires the user to edit the photo before uploading.

b2ap3 large 4

Joomla 4: add many new features in Media manager

Support multi-files upload and drop & drag uploading
Edit pictures: crop, resize, rotate, rename.

b2ap3 large 3

8. PHP version required

Integrating with the latest PHP (Hypertext Preprocessor) version - a language programming especially for developing web - Joomla 4 has faster performance and more security with lots of improved features.

- Joomla 3: requires minimum PHP version 5.3+. Because the APC and database are only available to PHP 5.x.

- Joomla 4: require the latest PHP version 7+. Because PHP 7 uses the new model of engine called PHP-NG which increases the performance twice as much. Moreover, with the additional features like Abstract Syntax Tree and Null Coalesce Operator makes easier parsing of PHP code.

9. Change for Mootools and JQuery

This tool was added to address the problem of making powerful and flexible code, as well as keep it organized. However, since introduced in Joomla 2.5, the technology of Mootools is quite old and doesn’t have any impact on the newest version. Therefore, the Joomla team decided to keep up with the latest technology.

- Joomla 3: support Mootools and jQuery libraries. But libraries like those are slow and not frequently updated although they’re still active.

- Joomla 4: removed Mootools in order to increase the performance overall. Joomla team had to rewrite all jQuery in vanilla JS and ensure that jQuery won't be loaded in core. But you still will be able to use it if you want. Moreover, they are moving to custom elements, which are much faster, framework agnostic, and will also be fully accessible.

10. Optimize Codebase

Joomla 4 is developed to be the best version of Joomla. Joomla team integrated the latest technologies such as Bootstrap 4, jQuery 3, PHPMailer 6.0, Vuejs for Media Manager in order to build a stronger foundation of core codebase. Therefore, the codebase is well optimized and becomes friendly for users.

- Joomla 3: keep the outdated coding quality which should be optimized better.

- Joomla 4: pay attention more to creating an optimized and cleaner core codebase.

11. More secure

Security is always a concerning problem that every kind of CMS should focus on. Therefore, Joomla 4 has ensured security at a higher level.

- Joomla 3: still has many flaws in the security and continuously updated to fix security problems.

- Joomla 4: adds more security features such as supporting the prepared SQL statement, increasing the minimum supported software stack. Of course, with the latest technology, your site is more secure.

In Conclusion

Through comparing the differences between Joomla 4 and 3, it can be noticed that Joomla 4 has more advantages than Joomla 3 such as a smart interface, better responsiveness, better security, and x2 faster performance.



<< Go Back