Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

Mutation observer for "onChange" event is re-enabled to early when loading large document

Đang mở
#2,867 2 bình luận 0 reaction 0 người được giao Xem trên GitHub

@frankwalter-1 đang làm issue này rồi.

Từ ngày 31/12/2024.

Đánh giá

Độ khó
4/5
Thời gian dự kiến
3-5 ngày
Mức phù hợp với người mới
35/100
Loại issue
Lỗi
Độ rõ ràng
Khá rõ ràng
Mức độ hoạt động
Đình trệ
Công nghệ
typescript
Lĩnh vực
frontend

Hướng nghiên cứu

Bắt đầu từ luồng render() bất đồng bộ và vòng đời của MutationObserver, đặc biệt là isMutationBelongsToElement(), rồi tái hiện vấn đề với một tài liệu lớn trong khi profiling bằng Chrome. Được xem là hoàn tất khi observer vẫn không hoạt động cho đến khi quá trình rendering hoàn tất hoàn toàn, không có các lần gọi lặp lại và mức tải CPU đã mô tả.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

bug important

When replacing the editor contents by calling "render()" the MutationObserver that detects changes should be deactivated and reactivated after the new content has been rendered. It seems the async render() method just uses a 2000ms timer, so when a document takes longer to render the MutationObserver is re-enabled too early and there are hundreds of calls to "isMutationBelongsToElement()" that bay continue multiple seconds and creating 100% cpu load.

Steps to reproduce:

  1. load a document using render()
  2. load another very lange document using render()
  3. look at the Chrome performance monitor or record a performance profile and look at the many calls.

Expected behavior:
when rendering a new document the Editor makes sure that the new content has been fully rendered before re-activating the MutationObserver.

Editor.js version:
2.30.6

Plugins you use with their versions:
not relevant

Ngôn ngữ chính
TypeScript
Star
32k
Fork
2.2k
Merge trung bình
2 ngày 1 giờ
Pull request đã merge (30 ngày)
1

Chuẩn bị môi trường

Dự án này không cung cấp dev container, Dockerfile hay hướng dẫn đóng góp, nên bạn cần tự thiết lập môi trường: hãy bắt đầu từ README và xem hướng dẫn đóng góp lần đầu của chúng tôi để biết các bước chung.

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của codex-team/editor.js

Tất cả issue của codex-team/editor.js

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.