DTX

И на винде без антивируса можно работать.
А вообще лучше не загоняться на такие темы. Антивирь отслеживает только активность + я ни разу ещё не видел загубленного ссд.

www.outsidethebox.ms/14402

На практике конечное количество циклов перезаписи не имеет значения для подавляющего большинства пользователей. Ресурс современных SSD и логика их контроллеров позволяют выдерживать огромные объемы записываемых данных.

Ради интереса скачал прогу по замеру повреждений SSD.
Ноуту вроде года три, один-полтора из которых даже антивирь стоял)

border-top: 100px solid #f00;
border-right: 50vw solid #0f0;

codepen.io/anon/pen/OXRbBv

Upd:
Ладно, тогда clip-path)

codepen.io/anon/pen/jrMBZw

left: 50%;
transform: translateX(-50%);

codepen.io/anon/pen/PzzZpz

Flexbox и только, нафиг masonry
codepen.io/DTX/pen/gMaEyL

С вёрсткой и правда беда. Плюс на ваших примерах у меня был пустой экран, пока высоту для body не указал.
https://jsfiddle.net/d6raqp4g/9/
И jquery/jqueryUI надо было подключить

Нашёл.
context.clearRect(0, 0, canvas.width, canvas.height);

flexbox с двумя колонками. У широких новостей flex-grow:1, у мелких - 0

И начинаешь заполнять
.grow1
.grow0
.grow0
.grow1
.grow0
.grow0

Будет большая, две маленьких, большая и снова две маленьких

А вот и пример :)
codepen.io/DTX/full/qNOdRx
(сверху слева кнопка - Add News)

Ленивые просто вы.
А должны быть жадными.

https://learn.javascript.ru/regexp-greedy-and-lazy

Флаг U (ungreedy) в помощь
https://regex101.com/r/nK7aV6/1

codepen.io/anon/pen/bedGLa

Без ручной установки ширины для контейнера ничего не получится. Это проблема есть только у flex-direction: column.
stackoverflow.com/questions/33891709/when-flexbox-...

Если задать ширину, то всё будет ок:
codepen.io/anon/pen/XKbbZZ

Среди адекватных решений предлагают только расчет ширины с jQuery

codepen.io/DTX/pen/KMwByx

codepen.io/anon/pen/mEyjMR