Stuck in a Back Button Loop? Why JavaScript is Better Than jQuery for Web Page Redirection

When scrolling through forums and various troves of web development commentary, there's an ever-popular theme running through the questions often posed by beginner and intermediate developers: the difference between JavaScript and jQuery. 

And, not only is there discussion around differences, but there's often heated conversation around the appropriate times when one should be employed over the other. In this series, I'll highlight popular places where the efficacies of both JavaScript and jQuery are explored. 

For those of you unfamiliar with JavaScript and jQuery, there are a few items to keep in mind when starting out:  

• JavaScript is a scripting language used for web development and is known for being interactive, multi-paradigmatic, universally supported, and dynamic. The internet as we know it is built on JavaScript. 
• jQuery is a specific library of JavaScript code, but is often viewed as a separate language due to its power, optimization of oft-scripted code, and simplicity.  
• jQuery reduces coding time, making it a go-to for developers in the modern web development environment.  
• It shouldn’t be assumed that you’re writing either solely in jQuery or solely in JavaScript, as both can be intermingled in an application. 

With these ideas in mind, let's move to the thought project of today: Is JavaScript or jQuery preferable for web page redirection?  

Given the foundational aspects with what we know about both, it initially seems likely that we would lean to jQuery for this answer. This is a situation, however, where the JavaScript solution is far simpler in construct than jQuery's answer.  

If you were to use jQuery's solution: 

var url  = "https://es.infragistics.com"; 
$(location).attr('href', url);

You would find that the originating page is being placed in the session history. With the redirect then navigating you to the new page, the page from which you redirected is going to be the most recent previous location. When a user selects the back button from your newly redirected page, the user will be brought to the original address and subsequently redirected again. Essentially, it causes a never-ending loop with the back button, forcing the user to manually leave the web page or rapidly jam on the mouse button until they find their prior location. 

JavaScript's solution is straightforward, in this case, with: 

window.location.replace("https://es.infragistics.com");

This is replacing the current page with a new one, as replace() is removing the URL of the of the current page from the history. This makes sure that the user will not navigate back to the original address using the back button.  

We've all visited pages where we're been stuck in that unfortunate jQuery loop with the back button, and this is a clean-cut way of using JavaScript to avoid a common redirection mistake. As we move through this mini-series together, I'll work to answer common jQuery versus JavaScript questions and provide solutions or thoughts for best practices.  

As a last note, if you're looking to jump into quick web application building, consider our Ignite UI for JavaScript which provides a powerful component library at your fingertips. Furthermore, our Ignite UI CLI gives you the option to build using the command line and a simple way to cut down on your manual coding.