When using a regex in HTML5 pattern attribute you should escape characters very carefully, as those browsers that have ES6+ standard implemented might throw an exception when they "see" [\w\.-] (no need to escape dot, and once the pattern is compiled with u flag, it becomes an error).
Now, to fix the issue, you may add a (?!www\.[^.]+\.?$) lookahead after ^ to fail all inputs that start with www. and then have any 0 or more chars other than . and then an optional . at the end of the string.
You may use
^(?!www\.[^.]+\.?$)(?:https?:\/\/)?[\w.-]+(?:\.[\w.-]+)+[\w._~:/?#[\\\]@!$&'()*+,;=.-]+$
See the regex demo. Note I escaped both \ and ] in your pattern, I think you meant to match both (your original regex does not match \ with [\w\-\._~:/?#[\]@!\$&'\(\)\*\+,;=.]).
Note that the HTML5 pattern regex is anchored by default, you need no ^ and $ at the start/end:
pattern="(?!www\.[^.]+\.?$)(?:https?:\/\/)?[\w.-]+(?:\.[\w.-]+)+[\w._~:/?#[\\\]@!$&'()*+,;=.-]+"
But you may still keep them if you want.
^(?!www\.[^.]+$)(?:https?:\/\/)?[\w.-]+(?:\.[\w.-]+)+[\w._~:/?#[\\\]@!$&'()*+,;=.-]+$(demo).