Render raster images as outlines in Outline mode

[YohYamasaki]

Closes #2888

Screencasts

Before

Screen.Recording.2026-02-25.at.08.04.18.mov

After

Screen.Recording.2026-02-25.at.07.59.43.mov

What changed

• If RenderMode::Outline, create a rectangle then apply the same transform as the other modes but without the image scaling factor as the rectangle is already an identity.
• Added a check to avoid creating unnecessary blending layer for the outline mode.
• Apply the above changes for the vello renderer of Raster<CPU> and Raster<GPU>.
• Organize a code bit for the GPU one to use the same variable names as the CPU one.

Small notes

Just a tiny thing, but I kept the duplicated outline code for now for readability, happy to extract it into a shared helper if preferred.

[gemini-code-assist]

Summary of Changes

Hello @YohYamasaki, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request introduces a significant enhancement to the rendering engine by enabling raster images to be displayed as simple outlines when the application is in 'Outline' mode. This change improves the visual clarity and performance for users working in this specific view, allowing them to focus on the structural layout of elements rather than their detailed content. The update ensures that raster images, whether CPU or GPU-backed, are represented consistently and efficiently as outlines, while also optimizing the blending process to avoid redundant operations.

Highlights

• Outline Rendering for Raster Images: Implemented the ability to render raster images as outlines when the RenderMode::Outline is active, providing a clear visual representation without full image data.
• Transform Application: When in outline mode, a rectangle representing the raster image's bounds is created and transformed using the layer's transform, but crucially, without applying the image's inherent scaling factor, as the rectangle is already an identity shape.
• Optimized Blending Layers: Added a condition to prevent the creation of unnecessary blending layers when rendering in outline mode, improving performance and simplifying the rendering pipeline for this specific mode.
• Renderer Support: These outline rendering and blending layer optimizations have been applied to both the Raster<CPU> and Raster<GPU> vello renderers, ensuring consistent behavior across different raster types.
• Code Organization: Refactored the Raster<GPU> rendering logic to align variable names and structure with the Raster<CPU> implementation, enhancing readability and maintainability.

Changelog

• node-graph/libraries/rendering/src/renderer.rs
  • Added necessary core_types, vector_types, and vello::kurbo imports for outline rendering functionality.
  • Modified the condition for pushing blending layers to exclude RenderMode::Outline, preventing unnecessary layer creation.
  • Introduced a match statement within the render_to_vello function for Raster<CPU> to conditionally render either the full image or an outline based on render_params.render_mode.
  • Implemented outline rendering for Raster<CPU> by creating a stroked rectangle with a specific transform and color.
  • Updated the render_to_vello function signature for Raster<GPU> to accept render_params.
  • Refactored Raster<GPU>'s blending logic to use alpha_blending for consistency and updated the blending layer condition.
  • Added a match statement within the render_to_vello function for Raster<GPU> to conditionally render either the full image or an outline, mirroring the Raster<CPU> logic.

Activity

• The author provided a detailed description of the changes, including the motivation and specific modifications made.
• Screencasts demonstrating the 'Before' and 'After' behavior of raster image rendering in Outline mode were included, visually confirming the implemented changes.
• The author noted a small point about duplicated outline code, indicating a consideration for future refactoring if preferred by reviewers.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

This pull request introduces outlining for raster images in Outline mode. There's a logical inconsistency between the CPU and GPU implementations for when a blending layer is created, which could lead to different visual results. My review comments provide specific suggestions to address these points.

[Keavon]

!build (Run ID 22387315862)

[github-actions]

📦 Build Complete for e7f186e
https://27352ce5.graphite.pages.dev