URL Encoder

URLs (Uniform Resource Locators) can only be sent over the Internet using the standard ASCII character-set.

If a URL contains characters outside the ASCII set (like spaces, accented letters, or emojis), the browser must convert them into a valid ASCII format. This is done through "Percent-encoding"—replacing the unsafe character with a % followed by two hexadecimal digits representing its byte value.

Developers frequently confuse the two native JavaScript encoding functions, leading to broken links and API failures.

• encodeURI(): Used to encode an entire URL (like https://example.com/my page). It intentionally ignores characters that have special structural meaning in a URL, like :, /, ?, and &, so the link still functions as a valid address.
• encodeURIComponent(): Used to encode a specific piece of a URL (like a query parameter value). It ruthlessly encodes everything, including / and ?.

If you try to pass an entire URL string through encodeURIComponent(), it will break the protocol string https:// into https%3A%2F%2F, destroying the link's structural validity.

Conversely, if you encode a URL, and then accidentally encode it again later in the pipeline, the % characters themselves get encoded into %25, resulting in corrupted data like %2520 instead of %20 (a space).