Super langsames Rendering in Chrom

Question

Warum macht es so langsam?

https://jsfiddle.net/g3xf5hyy/

In iea und Firefox funktioniert es super schnell.

.xxx { 
    padding: 6px; 
    border: 1px solid silver; 
    background-color: #f7f7f7; 
    color: #333; 
    max-height: 500px; 
    overflow-y: auto; 
    overflow-x: hidden; 
    word-wrap: break-word; 
    word-break: break-all; 
    overflow-wrap: break-word; 
    } 





<div> 


    <div> 

    <div> 

     <div class="xxx"> 
very-long-line-without-any-line-breaks-thousands-of-chars 
    </div> 


    </div> 
</div> 
</div> 

Answer 1

Es ist ein interessantes Problem und ich werde auf jeden Fall versuchen, die Ursache zu finden. Sein langsam aufgrund unten CSS in Ihrer Klasse

 word-break: break-all; 

es von Ihrem CSS entfernen und es wird funktionieren.

https://jsfiddle.net/g3xf5hyy/2/