Why shouldn't I use Alert in JavaScript? [closed]

Question

I need to notify the user under certain circumstances and have seen that confirm() and alert() shouldn't be used. Instead, a lot of questions mention using the modal thing in jQuery UI, especially if you need to style things. That's all fine and dandy, but, at the end of the day, what's the reason coders are saying you should stay away from it?

This is a pretty good example of how people feel, but pretty much any other question dealing with styling an alert box has the same comments. Is it only a styling issue or are there more fundamental reasons to shy away from this built-in functionality?

More importantly, none of the answers talk about what you ought to use instead. Are jQuery UI and similarly pre-built solutions simply the only answer? Why? Is it performance or security or inexperienced coders who need something easy to use or...?

Edit:

Okay, so let me clarify a bit. The reason I'm asking is because the alert functionality is to prevent a user from accidentally wiping out the work they've been doing since there are three ways to start a new plan on this page and each wipes out the existing inner html for the div where the plan is displayed.

Most of what I'm hearing is that it's bad for users and UI, but, if the anger-inducing, attention grabbing is what I want, what should I use instead? Someone mentioned that alerts / confirms halt JavaScript execution and may prevent you from using other tabs. That's closer to the functionality problems I'm expecting. I do understand that it's bad for UI, but I'm looking for more technical reasons here.

Answer 1

There are no "technical reasons" that you should not be using the built-in browser methods for alert and confirm functionality. It's all opinionated.

lets split this into two parts.

Alerts should never be used for debugging unless you intend for it to stop the execution of the code for a purpose. Otherwise, you should be using console.log because alert can actually change the result of your code if your code involves asynchronous logic. "But console.log isnt supported in IE!" Yes it is, if the console is open. In production code your debugging code should not be there anyway. To protect against forgotten console.logs, simply polyfil it. For uses other than debugging, such as informing the user that something happened, it's generally better to use some other way of informing the user that a change happened such as highlighting an element or a banner with informational text, however, there's nothing wrong with using an alert in that case as long as the pause in execution won't impact your code.

Confirm is the standard way of asking a user "Are you sure?" before performing a damaging action such as deleting information. It's easy to understand and is used by many sites, so i'd suggest using it within your own code as well. The alternative will generally result in a extra code adding unneeded complexity to your application. Keep in mind, however, confirm also blocks execution, so you should make sure that it won't affect any asynchronous logic that you may have running.

If your asynchronous code is written correctly, it generally won't be impacted by a pause in execution.