Денис Инешин

С помощью clip-path: https://jsfiddle.net/fyv0ezg9/

или с помощью фигур https://html5book.ru/css-figury/

const a = "10";
const b = "20";
const operator = "+";

const formula = a + operator + b;

console.log(eval(formula)); // 30

Помните о том что `eval()` - опасная штука. Может выполнить все что угодно.

https://jsfiddle.net/c9L4j1bq/

Например вот так: matthew.wagerfield.com/parallax

Ответ прост - серверный рендеринг страниц. Все современные фреймворки это умеют:
- https://angular.io/guide/universal
- https://css-tricks.com/server-side-react-rendering/
- https://vuejs.org/v2/guide/ssr.html

Вам нужно разделить development и production билды.
Сборка проекта со всеми минификациями, генерацией source-maps и прочими штуками - очень тяжелый процесс.

Для локальной разработки желательно этот процесс упростить. Убрать сжатие, минификацию, префиексеры и т.п.
Это резко ускорит разработку. Ну а перед деплоем на сервер - делайте полный билд.

Смотря у кого скопируете конечно :)
В целом не рекомендуется, могут быть последствия вплоть до юридических.

Так что крадите идеи, а не дизайны.

В данном вопросе поможет здравый смысл и тестирование.

Допустим у нас есть абстрактное фоновое изображение как часть UI. В большинстве случаев для подобных изображений достаточно будет иметь коэффициент 1х - 1.5х.

Если изображение более детальное - ставим для начала коэффициент 2х и смотрим как это выглядит на живом смартфоне. Обычно коэффициента 2х более чем достаточно для детальных изображений или фотографий.

Коэффициента больше чем 2х могут потребовать разве что схемы с тонкими линиями.