Userscripts: Expanding Browser Functionality

Userscripts have become a fantastic invention for individuals who desire to utilize their web browsers for more than just checking emails. Extensions such as Tampermonkey or Greasemonkey empower users to create or install scripts that enhance the functionality of websites, web apps, and services. This simple yet effective approach enables users to augment their browsing experience in ways that are not typically supported by browser extensions.

However, it is crucial to be mindful of the potential risks associated with userscripts and to carefully consider the source and trustworthiness of the scripts one installs. While this powerful system provides ample opportunities, it is essential to exercise caution to prevent exploitation by third parties. Fortunately, certain security features mitigate some of these risks. For instance, userscripts do not function within the context of online banking applications, ensuring a higher level of safety.

Moreover, developers can specify precisely on which websites their scripts can be executed. Creating your own script is a straightforward process—simply click on "New script" in the browser extension, and you're good to go. However, for more experienced web developers who prefer languages like TypeScript and comprehensive IDEs like VSCode, writing code in the web editor provided by the browser extension may become cumbersome.

To simplify the process of setting up a development environment, I recently published a template on GitHub. This template not only offers a clean project structure but also provides tooling to generate the config header of the userscript and to compile an app icon into a base64 string, which can be attached to the config. By leveraging TypeScript, the template facilitates the development process and yields a finalized script ready for upload upon the completion of the build process.

I recently utilized this template to enhance the media library of the Second German Television by adding a "picture-in-picture" function to all videos. If this piques your interest, you can find the template on my GitHub account here. Feel free to explore and utilize it to enhance your browsing experience.

Best regards, and have a delightful Thursday!

Yours sincerely,
Josun