Overview
The article discusses LinkedIn's transition from a monolithic JavaScript build pipeline to a more modern, scalable solution using Node Package Manager (NPM) and Broccoli. It highlights the challenges faced with the old system and outlines the benefits and implementation strategies of the new pipeline.
What You'll Learn
1
How to integrate NPM and Broccoli into existing JavaScript projects
2
Why transitioning from a monolithic to a modular build system enhances scalability
3
When to choose between the Ember ecosystem and the Play-NPM-Pipeline for upgrades
Prerequisites & Requirements
- Understanding of JavaScript build tools and dependency management
- Familiarity with Node Package Manager (NPM) and Broccoli(optional)
Key Questions Answered
What challenges did LinkedIn face with its monolithic JavaScript build system?
LinkedIn's monolithic build system faced several challenges, including a single bad commit invalidating the entire monolith, lack of useful dependency graphs, long page loads due to large JavaScript packages, and lengthy rebuilds for minor changes. These issues highlighted the need for a more granular and scalable approach to dependency management.
How does the Play-NPM-Pipeline improve existing Play stacks?
The Play-NPM-Pipeline allows existing Play stacks to integrate modern NPM workflows seamlessly. It provides a command line tool for upgrading Play servers, enables commands for building and cleaning projects, and offers tools for customizing Broccoli build scripts, thus enhancing the development process without requiring a complete rewrite.
What are the two upgrade paths provided for developers at LinkedIn?
LinkedIn offers two upgrade paths: the first is to fully embrace the Ember ecosystem, which requires a significant rebuild but provides extensive community support. The second is the Play-NPM-Pipeline, which allows teams to integrate NPM into existing Play stacks with minimal disruption, making it easier for developers to adopt modern practices.
Technologies & Tools
Tool
Node Package Manager (npm)
Used for managing JavaScript packages and dependencies.
Build Tool
Broccoli
Used for building and managing the JavaScript file tree.
Framework
Ember
Framework chosen for building single-page applications.
Key Actionable Insights
1Adopting NPM as the package manager for static content can significantly enhance control over versioned packages.This allows developers to leverage the vast ecosystem of tools and libraries available in the open-source community, improving development efficiency and code quality.
2Implementing the Play-NPM-Pipeline can facilitate a smoother transition for teams reluctant to fully switch to the Ember ecosystem.By providing tools that integrate with existing workflows, teams can gradually adopt modern practices without the overhead of a complete system overhaul.
3Utilizing Broccoli for build processes allows for better management of JavaScript dependencies and improved build times.This is particularly beneficial for large teams where multiple projects need to share common assets and libraries, reducing redundancy and improving maintainability.
Common Pitfalls
1
Failing to account for the integration challenges when transitioning from a monolithic to a modular build system can lead to significant disruptions.
It is crucial to plan for potential friction and provide adequate support and training for developers to adapt to the new tools and workflows.
Related Concepts
Javascript Build Tools
Dependency Management
Single-page Applications
Open-source Development Practices