Trang này được dịch bởi Cloud Translation API.

Quản lý quá trình kết xuất

Hệ thống quản lý quá trình kết xuất sẽ cho trình kết xuất biết thời điểm kết xuất lại các khối. Trình phân tích cú pháp đảm bảo rằng khi một khối được sửa đổi (ví dụ: đặt các giá trị của trường hoặc thêm dữ liệu đầu vào), hình dạng của khối đó sẽ được cập nhật cho khớp.

Khi nào nên quan tâm

Bạn cần tương tác với hệ thống này nếu bạn:

Thêm phương thức vào Blockly để sửa đổi hình dạng của khối.
Thêm các phương thức vào Blockly dựa trên kích thước đã cập nhật hoặc thông tin vị trí của khối.

Cách thức hoạt động

Tự động thêm vào danh sách chờ. Bất cứ khi nào một khối được sửa đổi, Blockly sẽ "xếp hàng" một kết xuất cho khối đó. Một số ví dụ về các nội dung sửa đổi hàng đợi kết xuất là:
- Đặt giá trị của một trường
- Thêm hoặc xoá dữ liệu đầu vào
- Kết nối hoặc ngắt kết nối một nhóm con
Tạo một nhóm. Khi một khối được đưa vào hàng đợi, hệ thống quản lý kết xuất sẽ thêm khối đó và mọi khối mẹ của khối đó vào một tập hợp khối cần được kết xuất lại.
Yêu cầu gọi lại. Sau đó, hệ thống quản lý chế độ hiển thị yêu cầu gọi lại bằng requestAnimationFrame. Lệnh gọi lại này được trình duyệt gọi bên phải trước khi vẽ khung hiện tại.
Hiển thị lại tập hợp (dưới dạng cây). Khi lệnh gọi lại requestAnimationFrame được gọi, hệ thống quản lý kết xuất sẽ kết xuất mọi khối trong tập hợp, từ các khối lá đến các khối gốc. Điều này đảm bảo các khối con có thông tin chính xác về kích thước trước khi các khối mẹ được hiển thị để các khối mẹ có thể kéo dài xung quanh các khối con đó.

Lý do hoạt động của tính năng này

Khi đợi kết xuất lại các khối cho đến khi ngay trước khi khung hiện tại được vẽ, hệ thống quản lý kết xuất có thể loại bỏ các yêu cầu kết xuất trùng lặp. Nếu các khối luôn được kết xuất ngay lập tức, thì cùng một khối có thể được kết xuất nhiều lần trong một hàng một cách không cần thiết. Thay vào đó, các yêu cầu kết xuất sẽ được phân theo lô và mỗi khối đã thay đổi chỉ được vẽ một lần ở cuối khung, sau khi trạng thái của khối đã hoàn tất. Loại bỏ hoạt động kết xuất giúp Blockly hiệu quả hơn nhiều.

Ví dụ: việc chèn một khối giữa hai hàng đợi khác sẽ kết xuất 11, nhưng thực sự chỉ có 3 khối xảy ra (một khối cho mỗi khối). Hiệu suất tăng gấp 3,6 lần.

Cách sử dụng

Thường thì bạn không cần quan tâm đến hệ thống quản lý kết xuất, vì hệ thống này sẽ tự động hoạt động khi bạn sửa đổi một khối. Tuy nhiên, có một vài trường hợp bạn phải tương tác trực tiếp với nó.

Kết xuất hàng đợi

Nếu đang thêm một phương thức mới vào Blockly để cập nhật hình dạng của một khối, bạn cần gọi BlockSvg.prototype.queueRender để xếp hàng đợi kết xuất khối đó.

Chờ quá trình hiển thị kết thúc

Nếu đang thêm một phương thức mới vào Blockly và yêu cầu cập nhật thông tin về kích thước hoặc vị trí của một khối, thì bạn nên đợi lời hứa renderManagement.finishQueuedRenders(). Lời hứa này được phân giải sau khi hoàn tất mọi kết xuất trong hàng đợi hoặc ngay lập tức nếu không có kết xuất nào trong hàng đợi.

import * as renderManagement from './renderManagement.js';

function async myNewMethod() {
  block.somethingThatModifiesTheShape();
  // Await the promise.
  await renderManagement.finishQueuedRenders();
  myThingThatReliesOnPositioningInfo();
}

Kích hoạt kết xuất ở hàng đợi ngay lập tức

Nếu thêm một phương thức mới vào Blockly và phương thức này yêu cầu cập nhật thông tin về kích thước hoặc vị trí của một khối, và bạn không thể đợi đến khung hình tiếp theo để mọi lượt kết xuất hoàn tất, bạn có thể gọi renderManagement.triggerQueuedRenders để buộc mọi lượt kết xuất trong hàng đợi xảy ra ngay lập tức.

import * as renderManagement from './renderManagement.js';

function async myNewMethod() {
  block.somethingThatModifiesTheShape();
  // Trigger an immediate render.
  renderManagement.triggerQueuedRenders();
  myThingThatReliesOnPositioningInfo();
}

Nói chung, bạn không muốn làm điều này vì nó kém hiệu quả hơn. Chỉ cần thiết trong trường hợp sự chậm trễ gây ra trải nghiệm người dùng kém. Ví dụ: điểm đánh dấu chèn cần có thông tin vị trí và quan trọng là điểm đánh dấu chèn phải cung cấp cho người dùng ý kiến phản hồi ngay lập tức để kích hoạt kết xuất ngay lập tức.

Cũng có một vài vị trí trong cốt lõi kích hoạt việc kết xuất ngay lập tức vì lý do tương thích ngược. Chúng tôi dự định loại bỏ những tính năng này trong phiên bản 11.