I am currently trying to optimize the performance when inserting and editing large amounts of content in ckeditor-vue. Specifically, we need an API that returns the same data as editor.getData() but allows us to retrieve only specific nodes.
Current Implementation
To achieve this, I have implemented the following solution. However, I would like to know if there is an existing API in CKEditor that can handle this task more efficiently:
getContentAtIndex(index) {
const modelElement = this.editor.model.document.getRoot().getChild(index);
if (!modelElement) return "";
const viewFragment = this.editor.data.toView(modelElement);
let html = this.editor.data.processor.toData(viewFragment);
let tagName = modelElement.name;
if (modelElement.name.startsWith('heading')) {
tagName = `h${modelElement.name.slice(-1)}`;
} else if (modelElement.name === 'paragraph') {
tagName = 'p';
}
const attributes = Array.from(modelElement.getAttributeKeys())
.map(attrKey => `${attrKey}="${modelElement.getAttribute(attrKey)}"`)
.join(' ');
return `<${tagName}${attributes ? ` ${attributes}` : ''}>${html}</${tagName}>`;
}
This message is being posted via a translation tool, so there might be slight changes in meaning. Thank you for your understanding.
Problem Description
I am currently trying to optimize the performance when inserting and editing large amounts of content in ckeditor-vue. Specifically, we need an API that returns the same data as editor.getData() but allows us to retrieve only specific nodes.
Current Implementation
To achieve this, I have implemented the following solution. However, I would like to know if there is an existing API in CKEditor that can handle this task more efficiently:
This message is being posted via a translation tool, so there might be slight changes in meaning. Thank you for your understanding.