pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[IMP] web_editor: batch write in formatTables to avoid layout thrashing

Browse Source 
This batches all writes in the `formatTables` method of `convert_inline`
so as to minimize layout thrashing and therefore improve performance.

X-original-commit: f3c0f0c62b9f31e47ef8644c79e1b9751d0ba746
Part-of: odoo/odoo#84513
Co-authored-by: Nicolas Bayet <nby@odoo.com>
Co-authored-by: Antoine Guenet <age@odoo.com>
This commit is contained in:
Nicolas Bayet
2022-02-14 14:51:25 +00:00
committed by Antoine Guenet
co-authored by Antoine Guenet
parent 382b77bec2
commit 96c859eb0a
1 changed files with 7 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/web_editor/static/src/js/backend/convert_inline.js
+7 -5
View File
@@ -493,6 +493,7 @@ function fontToImg($editable) {
* @param {JQuery} $editable
*/
function formatTables($editable) {
const writes = [];
for (const table of $editable.find('table.o_mail_snippet_general, .o_mail_snippet_general table')) {
const $table = $(table);
const tablePaddingTop = parseFloat($table.css('padding-top').match(RE_PADDING)[1]);
@@ -509,26 +510,27 @@ function formatTables($editable) {
if (!rowIndex) {
const match = $column.css('padding-top').match(RE_PADDING);
const columnPaddingTop = match ? parseFloat(match[1]) : 0;
$column.css('padding-top', columnPaddingTop + tablePaddingTop);
writes.push(() => { $column.css('padding-top', columnPaddingTop + tablePaddingTop); });
}
if (columnIndex === $columnsInRow.length - 1) {
const match = $column.css('padding-right').match(RE_PADDING);
const columnPaddingRight = match ? parseFloat(match[1]) : 0;
$column.css('padding-right', columnPaddingRight + tablePaddingRight);
writes.push(() => { $column.css('padding-right', columnPaddingRight + tablePaddingRight); });
}
if (rowIndex === $rows.length - 1) {
const match = $column.css('padding-bottom').match(RE_PADDING);
const columnPaddingBottom = match ? parseFloat(match[1]) : 0;
$column.css('padding-bottom', columnPaddingBottom + tablePaddingBottom);
writes.push(() => { $column.css('padding-bottom', columnPaddingBottom + tablePaddingBottom); });
}
if (!columnIndex) {
const match = $column.css('padding-left').match(RE_PADDING);
const columnPaddingLeft = match ? parseFloat(match[1]) : 0;
$column.css('padding-left', columnPaddingLeft + tablePaddingLeft);
writes.push(() => { $column.css('padding-left', columnPaddingLeft + tablePaddingLeft); });
}
}
$table.css('padding', '');
writes.push(() => { $table.css('padding', ''); });
}
writes.forEach((fn) => fn());
// Ensure a tbody in every table and cancel its default style.
for (const table of $editable.find('table:not(:has(tbody))')) {
const $contents = $(table).contents();