<!-- Please make sure you have read the submission guidelines before posting an PR --> <!-- https://github.com/nrwl/nx/blob/master/CONTRIBUTING.md#-submitting-a-pr --> <!-- Please make sure that your commit message follows our format --> <!-- Example: `fix(nx): must begin with lowercase` --> <!-- If this is a particularly complex change or feature addition, you can request a dedicated Nx release for this pull request branch. Mention someone from the Nx team or the `@nrwl/nx-pipelines-reviewers` and they will confirm if the PR warrants its own release for testing purposes, and generate it for you if appropriate. --> ## Current Behavior N/A ## Expected Behavior Add new recipe on the CI section about using CIPE Affected Project Graph ## Related Issue(s) <!-- Please link the issue being fixed so it gets closed when this is merged. --> Fixes # --------- Co-authored-by: Isaac Mann <isaacplmann@gmail.com>
4.4 KiB
Reduce the Number of Affected Projects in a CI Pipeline Execution
When it comes to troubleshooting long-running CI pipeline executions, there are different tools available to help you identify the potential issues. One such tool is the Affected Project Graph feature on the CI Pipeline Execution page.
Getting to the CI Pipeline Execution Affected Project Graph
To access the affected project graph for the CI pipeline execution, navigate to the CI pipeline execution details page and click on the Affected Project Graph navigation item.
The affected project graph visualizes the projects that are part of the current CI pipeline execution.
Identifying a Potential Over-run of a CI Pipeline Execution
In this recipe, we will walk through a scenario where the affected project graph can be used to identify a potential over-run of a CI pipeline execution.
This is our repository structure:
apps/
├── web
├── web-e2e
├── nx-graph-test
├── nx-graph-test-e2e
└── recipes/
├── client
└── client-e2e
libs/
├── ui (button and icon components)
├── forms/
│ └── input
└── tooltip
Our most recent CI pipeline execution affects everything in the repository.
Likewise, the affected project graph for the Ci pipeline execution also visualizes all projects because everything is affected.
Create a New CI Pipeline Execution with a Code Change
Our ui library has 2 components: button and tooltip. From the graph, we can see that both our apps client and web depend on the ui library: client uses the tooltip component and web uses the button component.
Let's make an update to the tooltip component and see how it affects our next CI pipeline execution. Pushing this change to our repository will trigger a new CI pipeline execution.
This CI pipeline execution contains 14 tasks that are affected by the change we made to the tooltip component.
The affected project graph also shows that the change to tooltip component , which is part of the ui library, affects both the client and web apps.
At this point, we can ask ourselves that "Should a change to the tooltip component affect both the client and web apps or should it only affect the web app?" Our goal should be to always have the most efficient CI pipeline executions possible. Decreasing the number of affected projects will allow the number of tasks to be reduced, which will reduce the overall CI pipeline execution time.
Break Up the Source of the Affected Projects
To achieve our goal, we can break up the ui library into 2 separate libraries: button and tooltip.
Check out our blog post about splitting large projects into smaller ones.
Once we have done this, we will end up with the following project graph:
Let's make a change to the button component this time and see how it affects our next CI pipeline execution.
We've reduced the number of affected tasks from 14 to 8.
And the affected project graph also reflects that change properly.
{% callout type="info" title="Does your Affected Project Graph only show affected projects and not touched?" %}
- If your commit has changes to one of the global inputs, your projects will be affected but no specific project is touched directly.
- Make sure you are calling
start-ci-runto start using Nx Agents for touched projects to be recorded. Learn more about Nx Agents
{% /callout %}







