Baike.dev
All toolsAI codingTrendingOpen sourceNewsSubmit
Log in
Back to tool/Back to issues
#42441·dify

[Refactor/Chore] Optimize the oversized in-site notification background asset

Author: hyobanCreated Sep 17, 2026Updated Sep 17, 2026
Labelsproject#dify

Self Checks

  • I have read the Contributing Guide and Language Policy.
  • This is only for refactors or chores; if you would like to ask a question, please head to Discussions.
  • I have searched for existing issues search for existing issues, including closed ones.
  • I confirm that I am using English to submit this report, otherwise it will be closed.
  • 【中文用户 & Non English User】请使用英语提交,否则会被关闭 :)
  • Please do not modify this template :) and fill in all the required fields.

Description

Optimize web/public/in-site-message/header-bg.svg, the fallback background for the small in-site notification header.

The SVG declares a 360×128 viewport but embeds a 4096×1625 PNG of 3,577,618 bytes as base64. The SVG is 4,772,282 bytes; estimated gzip remains 3,579,965 bytes. The public file is copied unchanged to the client build.

web/app/components/app/in-site-message/index.tsx uses this URL as DEFAULT_HEADER_BG_URL. The notification wrapper is Cloud-edition gated, and the fallback applies when title_pic_url is undefined. This is not a claim that every page or Community deployment downloads the image; the local Community page did not exercise a real notification download.

Reproduce by checking the SVG size, decoding its embedded PNG dimensions, and displaying a Cloud notification without a custom header image.

Motivation

A decorative header should not require a multi-megabyte raster. Replace the embedded image with an appropriately sized optimized asset, or an equivalent lightweight design, while preserving its appearance.

Acceptance criteria:

  • Compare the background at normal and high-DPI display scales.
  • Preserve custom header-image behavior and the fallback layout.
  • Record before/after asset size and actual production compressed transfer.

Additional Context

Observed on a local Dify 1.17.1 development branch based on 06e473015a9a1abb71da88ac0a0e92d96a992008, with local DevTools integration patches; Vinext 1.0.0-beta.10, Vite+ core 0.3.2, Node 24.21.0. Recheck against current main before implementation. Build measurements are diagnostic baselines, not controlled production network benchmarks.

Source: langgenius/dify

View original on GitHubView discussion on GitHub