There are performance and memory footprint differences between those methods. This might be important in low-level operations that are executed many times on your web page (such as general replacements done on page load). You can get away using replace function most of the time, but never use split/join.

Split-join

Split-join is very inefficient; never use it for replacements. It performs a search, creates an array (possibly very large), and then loops over the array to build a new string. Replacements should simply construct a new string directly.

// ❌ don't do this
console.log(source.split(str1).join(str2));

replaceAll(string) vs replace

Use replaceAll with a string when you can. The call to replaceAll(string, string) will be significantly faster than using a RegExp, as it's easier to optimize. Benchmarks show replaceAll is about 2x faster in Firefox 147 (even for very short strings). Also note that there is no point in compiling regular expressions when you only need to work with strings (new RegExp adds both object creation and parser overhead).

// ✅replaceAll(str) wins over ❌replace(re)
console.log(source.replace(new RegExp(str1,"g"), str2));
//versus
console.log(source.replaceAll(str1, str2));

On top of performance issues, if str1 contains special characters, you might get very unusual results:

// ❌ this will just be wrong; all this is part of a regexp: `[/, '').replace(/]`
'ab[c]'.replace(/[/, '').replace(/]/, ''); // -> b[c]
// ❌ `[` should be escaped and so you get: SyntaxError: unterminated character class.
'ab[c]'.replace(new RegExp('['), '').replace(new RegExp(']'), '')

replaceAll(RegExp) vs replace

When you want to use a regular expression, there is less of a difference between replaceAll and replace. In terms of performance, replace might actually be better, as it has been optimized over a longer period of time in browsers.

// replaceAll(re) ~= replace(re)
console.log(source.replace(regex, replacement));
//versus
console.log(source.replaceAll(regex, replacement));

Note however that it might be a good thing that 'abc'.replaceAll(/abc/, '') throws an error. If your intention is to replace all occurrences, it's very easy to make a mistake and forget the g modifier. So replace might fail silently, but replaceAll will let you know.

/** Replaces all occurrences of "ice" with "summer" */
function replaceIceWithSummer(text) {
    // ❌oh no we forgot g, ✅but replaceAll will remind us to replace all of ice
    return text.replaceAll(/ice/i, "summer");
}

That is even more important when the regexp is used in many places.