Para reduzir os saltos de tamanho de tela, após personalizar uma página é vital ajustar o tamanho mínimo das sections da home.
Dessa forma, tornando o carregamento algo mais previsto, com uma altura praticamente definida para a página.
Para isso, crie a função abaixo no console do navegador e chame a função.
async function saveSectionsCLS() {
let obj = {};
let prodSlideLenght = 0;
const waitFor = delay => new Promise(resolve => setTimeout(resolve, delay));
if (infoPanel.globalData.layout_tipo == 'D' && window.innerWidth < 1200) {
document.querySelector('[data-wsjs-indexcontainer]').style.width = 'calc(100vw + 2rem + 12px)!important'
}
window.dispatchEvent(new Event('resize'));
await waitFor(100);
document.querySelectorAll('[data-wsjs-draginner] > section').forEach((sec, i) => {
let secType = sec.getAttribute('data-wsjs-sectype');
let tempSec = infoPanel.virtual.alltempsecs[i];
let saveSec = false;
switch (secType) {
case 'prodSlide':
if (wsMain.globalData.listGroupProds.wssource != 'ws-plchold') {
prodSlideLenght++;
if (prodSlideLenght <= wsMain.globalData.listGroupProds.grupos.length) saveSec = true
}
break;
case 'prodLast':
saveSec = false;
break;
case 'prodList':
if (wsMain.globalData.listHomeProds.wssource != 'ws-plchold') saveSec = true
break;
case 'manufacturer':
if (wsMain.globalData.infoManufactureres.wssource != 'ws-plchold') {
saveSec = true;
}
break;
case 'banners':
if (wsMain.globalData.infoBanners.wssource != 'ws-plchold') {
let bannerType = tempSec.querySelector('[data-wsjs-banner]').getAttribute('data-wsjs-banner');
let banners = wsMain.globalData.infoBanners.banners.filter(b => b.dispositivos == infoPanel.globalData.layout_tipo);
let bannersTypes = banners.map(b => b.tipo);
bannersTypes = bannersTypes.filter((b, i) => bannersTypes.indexOf(b) === i);
if (bannersTypes.indexOf(bannerType) != -1) saveSec = true;
}
break;
case 'condicoes':
if (wsMain.globalData.infoLoja.condicoes && wsMain.globalData.infoLoja.condicoes.length > 0 && wsMain.globalData.infoLoja.condicoes[0].id != 0) {
saveSec = true;
}
break;
default:
saveSec = true;
break;
}
if (secType == 'prodList' || secType == 'prodSlide') {
let virtualSpan = tempSec.querySelector('[data-wsjs-prod-list]');
let virtualOptions = wsMain.tools.getWsData(virtualSpan, 'options');
let w = 0, h = 0;
let imgs = sec.querySelectorAll('img');
imgs.forEach(img => w += img.clientWidth);
imgs.forEach(img => h += img.clientHeight);
w = w / imgs.length
h = h / imgs.length
virtualOptions.imgAttr = `${w}x${h}`;
virtualSpan.setAttribute('data-wsjs-options', additionalPanel.convertObjectToKeyValueString(virtualOptions));
}
if (!secType) saveSec = false;
if (saveSec) {
let minHeight = Math.round(sec.offsetHeight) + 'px';
tempSec.removeAttribute('data-wsjs-container');
const secId = tempSec.getAttribute('data-wsjs-id');
obj[secId] = minHeight;
} else {
tempSec.setAttribute('data-wsjs-container', 'true');
}
sec.querySelectorAll('img').forEach((img, z) => {
try {
let virtualImage = tempSec.querySelectorAll('img')[z];
if (virtualImage) {
virtualImage.setAttribute('width', Math.round(img.clientWidth));
virtualImage.setAttribute('height', Math.round(img.clientHeight));
}
} catch (err) { }
});
});
await waitFor(50);
return obj;
}

Após isso, você pode criar um bloco de estilos no arquivo head do projeto no formato abaixo:
<style>
[data-wsjs-clsid="banners-1"] {
min-height: 304px
}
</style>
Com cada uma das áreas retornadas no array