液化苹果浏览器闪屏问题

This commit is contained in:
李志鹏
2026-04-14 10:02:06 +08:00
parent 4352f7c2f4
commit f43c56236b
2 changed files with 15 additions and 5 deletions

View File

@@ -85,7 +85,7 @@ export class LiquifyRealTimeUpdater {
if (isDrawing && this.config.useDirectUpdate) {
// 拖拽过程中使用快速更新(降低质量以提高性能)
this._fastUpdate(imageData);
await this._fastUpdate(imageData);
} else {
// 拖拽结束后使用完整更新(最高质量)
await this._fullUpdate(imageData);
@@ -124,7 +124,7 @@ export class LiquifyRealTimeUpdater {
* @param {ImageData} imageData 图像数据
* @private
*/
_fastUpdate(imageData) {
async _fastUpdate(imageData) {
if (!this.targetObject || !this.targetObject._element) {
return;
}
@@ -138,12 +138,14 @@ export class LiquifyRealTimeUpdater {
// 直接更新fabric对象的图像源使用PNG格式保持质量
const targetElement = this.targetObject._element;
// 方案1: 直接设置src属性最高性能
const dataURL = this.tempCanvas.toDataURL("image/png", quality);
if (targetElement.src !== dataURL) {
targetElement.src = dataURL;
// targetElement.src = dataURL;
const image = new Image();
image.src = dataURL;
await image.decode();
this.targetObject.setElement(image);
// 关键优化直接设置fabric对象为脏状态但不立即渲染
// this.targetObject.dirty = false; // 标记为不需要立即渲染