How we use Web Components at GitHub

GitHub has evolved its front-end development practices by embracing Web Components, transitioning from a jQuery-based codebase to a more modern, component-driven approach. This shift allows for better encapsulation, reusability, and maintainability across its extensive codebase. The company utilizes tools like Catalyst, an open-source library that simplifies Web Component authoring, and ViewComponent within Rails to streamline the development process while maintaining high-quality standards. GitHub's strategy includes transforming application-specific components into robust, dependency-free Web Components suitable for open-source release, exemplified by the <typing-effect> element. This approach has been well-received internally, and GitHub plans to continue expanding its collection of "GitHub Elements" while exploring future advancements like Template Parts and Declarative Shadow DOM to further enhance Web Component development.