Проблема с рендерингом Chrome?

#html #css #google-chrome

#HTML #css #google-chrome

Вопрос:

Я использую Chrome 53.0.2785.143, и я столкнулся с проблемой рендеринга, которая, казалось, чаще возникала в моем приложении при использовании CSS transform scale.

Вот JSFiddle, который показывает проблему, попробуйте прокрутить весь путь вниз, в конце концов вы достигнете стадии, когда ничего не будет отображаться. В Firefox этот JSFiddle будет работать нормально.

HTML

 <div class="content">
Rendering issue 
...
...
(you need to repeat this ~75000 times)
</div>
  

CSS

 .content {
  background-color: white;
  color: red;
  width: 600px;
  font-size: 100px;
}
  

Мне интересно, сталкивался ли кто-нибудь еще с этой проблемой и знает, как с ней справиться.

Комментарии:

1. Ну, воспроизведено в последней версии Chrome.

2. Firefox 49 также, похоже, требует времени для его рендеринга

3. Также, похоже, возникает в Edge (Microsoft EdgeHTML 14.14393). Это (img) то, о чем вы говорите?

4. Да, кажется, немного по-другому, но на самом деле это происходит и в Firefox, но по-другому

Ответ №1:

Я опубликовал эту проблему в Chromium, и они ответили, что этот пример достигает предела рисования. Ссылка на проблему

«Вычисленная высота в div равна 1.725e 07px, поэтому неудивительно, что мы прекращаем его рендеринг. Мы действительно отображаем что-то до 1.665e 07px.

Это WontFix. В какой-то момент нам нужно ограничить размер закрашенной области, и это кажется разумным «.