Cache Vello render output as stitchable textures

desktop/src/app.rs

@@ -74,7 +74,7 @@ impl App {
 			loop {
 				let result = runtime.block_on(DesktopWrapper::execute_node_graph());
 				rendering_app_event_scheduler.schedule(AppEvent::NodeGraphExecutionResult(result));
-				let _ = start_render_receiver.recv();
+				let _ = start_render_receiver.recv_timeout(Duration::from_millis(10));
 			}
 		});
 

editor/src/dispatcher.rs

@@ -51,6 +51,7 @@ const SIDE_EFFECT_FREE_MESSAGES: &[MessageDiscriminant] = &[
 		NodeGraphMessageDiscriminant::RunDocumentGraph,
 	))),
 	MessageDiscriminant::Portfolio(PortfolioMessageDiscriminant::SubmitActiveGraphRender),
+	MessageDiscriminant::Portfolio(PortfolioMessageDiscriminant::SubmitEyedropperPreviewRender),
 	MessageDiscriminant::Frontend(FrontendMessageDiscriminant::TriggerFontDataLoad),
 	MessageDiscriminant::Frontend(FrontendMessageDiscriminant::UpdateUIScale),
 ];

editor/src/messages/dialog/preferences_dialog/preferences_dialog_message.rs

@@ -4,4 +4,5 @@ use crate::messages::prelude::*;
 #[derive(Eq, PartialEq, Clone, Debug, serde::Serialize, serde::Deserialize)]
 pub enum PreferencesDialogMessage {
 	Confirm,
+	Update,
 }

editor/src/messages/dialog/preferences_dialog/preferences_dialog_message_handler.rs

@@ -20,6 +20,7 @@ impl MessageHandler<PreferencesDialogMessage, PreferencesDialogMessageContext<'_
 
 		match message {
 			PreferencesDialogMessage::Confirm => {}
+			PreferencesDialogMessage::Update => {}
 		}
 
 		self.send_dialog_to_frontend(responses, preferences);
@@ -231,30 +232,36 @@ impl PreferencesDialogMessageHandler {
 				graph_wire_style,
 			];
 
-			let checkbox_id = CheckboxId::new();
-			let vello_description = "Use the experimental Vello renderer instead of SVG-based rendering.".to_string();
-			#[cfg(target_family = "wasm")]
-			let mut vello_description = vello_description;
-			#[cfg(target_family = "wasm")]
-			vello_description.push_str("\n\n(Your browser must support WebGPU.)");
-
-			let use_vello = vec![
+			let vello_description = "Auto uses Vello renderer when GPU is available.";
+			let vello_renderer_label = vec![
 				Separator::new(SeparatorStyle::Unrelated).widget_instance(),
 				Separator::new(SeparatorStyle::Unrelated).widget_instance(),
-				CheckboxInput::new(preferences.use_vello && preferences.supports_wgpu())
-					.tooltip_label("Vello Renderer")
-					.tooltip_description(vello_description.clone())
-					.disabled(!preferences.supports_wgpu())
-					.on_update(|checkbox_input: &CheckboxInput| PreferencesMessage::UseVello { use_vello: checkbox_input.checked }.into())
-					.for_label(checkbox_id)
-					.widget_instance(),
 				TextLabel::new("Vello Renderer")
 					.tooltip_label("Vello Renderer")
 					.tooltip_description(vello_description)
-					.disabled(!preferences.supports_wgpu())
-					.for_checkbox(checkbox_id)
 					.widget_instance(),
 			];
+			let vello_preference = RadioInput::new(vec![
+				RadioEntryData::new("Auto").label("Auto").on_update(move |_| {
+					PreferencesMessage::VelloPreference {
+						preference: graph_craft::wasm_application_io::VelloPreference::Auto,
+					}
+					.into()
+				}),
+				RadioEntryData::new("Disabled").label("Disabled").on_update(move |_| {
+					PreferencesMessage::VelloPreference {
+						preference: graph_craft::wasm_application_io::VelloPreference::Disabled,
+					}
+					.into()
+				}),
+			])
+			.selected_index(Some(preferences.vello_preference as u32))
+			.widget_instance();
+			let vello_preference = vec![
+				Separator::new(SeparatorStyle::Unrelated).widget_instance(),
+				Separator::new(SeparatorStyle::Unrelated).widget_instance(),
+				vello_preference,
+			];
 
 			let checkbox_id = CheckboxId::new();
 			let brush_tool_description = "
@@ -281,7 +288,47 @@ impl PreferencesDialogMessageHandler {
 					.widget_instance(),
 			];
 
-			rows.extend_from_slice(&[header, node_graph_wires_label, graph_wire_style, use_vello, brush_tool]);
+			let max_region_size_description =
+				"Maximum render region size in total pixels (width × height). Larger values require fewer render passes. If you see rendering artifacts or nothing at all, configure a smaller value.";
+			let max_region_size_label = vec![
+				Separator::new(SeparatorStyle::Unrelated).widget_instance(),
+				Separator::new(SeparatorStyle::Unrelated).widget_instance(),
+				TextLabel::new("Max Render Region Size")
+					.tooltip_label("Max Render Region Size")
+					.tooltip_description(max_region_size_description)
+					.disabled(!preferences.use_vello())
+					.widget_instance(),
+			];
+			let max_region_size = vec![
+				Separator::new(SeparatorStyle::Unrelated).widget_instance(),
+				Separator::new(SeparatorStyle::Unrelated).widget_instance(),
+				NumberInput::new(Some(preferences.max_render_region_size as f64))
+					.tooltip_label("Max Render Region Size")
+					.tooltip_description(max_region_size_description)
+					.mode_range()
+					.int()
+					.min(65536.)
+					.max(16777216.)
+					.increment_step(262144.)
+					.unit(" pixels")
+					.disabled(!preferences.use_vello())
+					.on_update(|number_input: &NumberInput| {
+						let size = number_input.value.unwrap_or(2073600.) as u32;
+						PreferencesMessage::MaxRenderRegionSize { size }.into()
+					})
+					.widget_instance(),
+			];
+
+			rows.extend_from_slice(&[
+				header,
+				node_graph_wires_label,
+				graph_wire_style,
+				vello_renderer_label,
+				vello_preference,
+				brush_tool,
+				max_region_size_label,
+				max_region_size,
+			]);
 		}
 
 		Layout(rows.into_iter().map(|r| LayoutGroup::Row { widgets: r }).collect())

editor/src/messages/portfolio/portfolio_message_handler.rs

@@ -1185,6 +1185,7 @@ impl MessageHandler<PortfolioMessage, PortfolioMessageContext<'_>> for Portfolio
 				let Some(document) = self.documents.get_mut(&document_id) else { return };
 
 				let resolution = glam::UVec2::splat(EYEDROPPER_PREVIEW_AREA_RESOLUTION);
+				let scale = viewport.scale();
 
 				let preview_offset_in_viewport = ipp.mouse.position - (glam::DVec2::splat(EYEDROPPER_PREVIEW_AREA_RESOLUTION as f64 / 2.));
 				let preview_offset_in_viewport = DAffine2::from_translation(preview_offset_in_viewport);
@@ -1196,7 +1197,7 @@ impl MessageHandler<PortfolioMessage, PortfolioMessageContext<'_>> for Portfolio
 
 				let result = self
 					.executor
-					.submit_eyedropper_preview(document_id, preview_transform, pointer_position, resolution, timing_information);
+					.submit_eyedropper_preview(document_id, preview_transform, pointer_position, resolution, scale, timing_information);
 
 				match result {
 					Err(description) => {
@@ -1364,10 +1365,11 @@ impl MessageHandler<PortfolioMessage, PortfolioMessageContext<'_>> for Portfolio
 				}
 			}
 			PortfolioMessage::UpdateVelloPreference => {
-				let active = if cfg!(target_family = "wasm") { false } else { preferences.use_vello };
+				// TODO: Resend this message once the GPU context is initialized to avoid having the hole punch be stuck in an invalid state
+				let active = if cfg!(target_family = "wasm") { false } else { preferences.use_vello() };
 				responses.add(FrontendMessage::UpdateViewportHolePunch { active });
 				responses.add(NodeGraphMessage::RunDocumentGraph);
-				self.persistent_data.use_vello = preferences.use_vello;
+				self.persistent_data.use_vello = preferences.use_vello();
 			}
 		}
 	}

editor/src/messages/preferences/preferences_message.rs

@@ -10,11 +10,12 @@ pub enum PreferencesMessage {
 	ResetToDefaults,
 
 	// Per-preference messages
-	UseVello { use_vello: bool },
+	VelloPreference { preference: graph_craft::wasm_application_io::VelloPreference },
 	SelectionMode { selection_mode: SelectionMode },
 	BrushTool { enabled: bool },
 	ModifyLayout { zoom_with_scroll: bool },
 	GraphWireStyle { style: GraphWireStyle },
 	ViewportZoomWheelRate { rate: f64 },
 	UIScale { scale: f64 },
+	MaxRenderRegionSize { size: u32 },
 }

editor/src/messages/preferences/preferences_message_handler.rs

@@ -5,6 +5,7 @@ use crate::messages::preferences::SelectionMode;
 use crate::messages::prelude::*;
 use crate::messages::tool::utility_types::ToolType;
 use graph_craft::wasm_application_io::EditorPreferences;
+use graphene_std::application_io::GetEditorPreferences;
 
 #[derive(ExtractField)]
 pub struct PreferencesMessageContext<'a> {
@@ -16,11 +17,12 @@ pub struct PreferencesMessageContext<'a> {
 pub struct PreferencesMessageHandler {
 	pub selection_mode: SelectionMode,
 	pub zoom_with_scroll: bool,
-	pub use_vello: bool,
+	pub vello_preference: graph_craft::wasm_application_io::VelloPreference,
 	pub brush_tool: bool,
 	pub graph_wire_style: GraphWireStyle,
 	pub viewport_zoom_wheel_rate: f64,
 	pub ui_scale: f64,
+	pub max_render_region_size: u32,
 }
 
 impl PreferencesMessageHandler {
@@ -30,25 +32,31 @@ impl PreferencesMessageHandler {
 
 	pub fn editor_preferences(&self) -> EditorPreferences {
 		EditorPreferences {
-			use_vello: self.use_vello && self.supports_wgpu(),
+			vello_preference: self.vello_preference,
+			max_render_region_size: self.max_render_region_size,
 		}
 	}
 
 	pub fn supports_wgpu(&self) -> bool {
 		graph_craft::wasm_application_io::wgpu_available().unwrap_or_default()
 	}
+
+	pub fn use_vello(&self) -> bool {
+		self.editor_preferences().use_vello()
+	}
 }
 
 impl Default for PreferencesMessageHandler {
 	fn default() -> Self {
 		Self {
 			selection_mode: SelectionMode::Touched,
 			zoom_with_scroll: matches!(MappingVariant::default(), MappingVariant::ZoomWithScroll),
-			use_vello: EditorPreferences::default().use_vello,
+			vello_preference: EditorPreferences::default().vello_preference,
 			brush_tool: false,
 			graph_wire_style: GraphWireStyle::default(),
 			viewport_zoom_wheel_rate: VIEWPORT_ZOOM_WHEEL_RATE,
 			ui_scale: UI_SCALE_DEFAULT,
+			max_render_region_size: 1920 * 1080,
 		}
 	}
 }
@@ -80,10 +88,11 @@ impl MessageHandler<PreferencesMessage, PreferencesMessageContext<'_>> for Prefe
 			}
 
 			// Per-preference messages
-			PreferencesMessage::UseVello { use_vello } => {
-				self.use_vello = use_vello;
+			PreferencesMessage::VelloPreference { preference } => {
+				self.vello_preference = preference;
 				responses.add(PortfolioMessage::UpdateVelloPreference);
 				responses.add(PortfolioMessage::EditorPreferences);
+				responses.add(PreferencesDialogMessage::Update);
 			}
 			PreferencesMessage::BrushTool { enabled } => {
 				self.brush_tool = enabled;
@@ -115,6 +124,11 @@ impl MessageHandler<PreferencesMessage, PreferencesMessageContext<'_>> for Prefe
 				self.ui_scale = scale;
 				responses.add(FrontendMessage::UpdateUIScale { scale: self.ui_scale });
 			}
+			PreferencesMessage::MaxRenderRegionSize { size } => {
+				self.max_render_region_size = size;
+				responses.add(PortfolioMessage::UpdateVelloPreference);
+				responses.add(PortfolioMessage::EditorPreferences);
+			}
 		}
 
 		responses.add(FrontendMessage::TriggerSavePreferences { preferences: self.clone() });

editor/src/messages/tool/tool_messages/eyedropper_tool.rs

@@ -48,10 +48,10 @@ impl<'a> MessageHandler<ToolMessage, &mut ToolActionMessageContext<'a>> for Eyed
 		if let ToolMessage::Eyedropper(EyedropperToolMessage::PreviewImage { data, width, height }) = message {
 			let image = EyedropperPreviewImage { data, width, height };
 
-			update_cursor_preview_common(responses, Some(image), context.input, context.global_tool_data, self.data.color_choice.clone());
-
 			if !self.data.preview {
 				disable_cursor_preview(responses, &mut self.data);
+			} else {
+				update_cursor_preview_common(responses, Some(image), context.input, context.global_tool_data, self.data.color_choice.clone());
 			}
 			return;
 		}