Рубрика «растеризация»

в 6:06, , рубрики: glsl, OpenGL, WebGL, конвейер рендеринга, Работа с 3D-графикой, растеризация, шейдеры

Современный OpenGL и, в более широком смысле, WebGL, сильно отличается от старого OpenGL, который я изучал в прошлом. Я понимаю, как работает растеризация, поэтому вполне разбираюсь в концепциях. Однако в каждом прочитанном мной туториале предлагались абстракции и вспомогательные функции, усложнявшие мне понимание того, какие части относятся к самим API OpenGL.

Уточню — такие абстракции, как разделение данных позиций и функциональности рендеринга на отдельные классы важны в реальных приложениях. Однако эти абстракции раскидывают код по разным областям и добавляют избыточность из-за бойлерплейта и передачи данных между логическими единицами. Мне удобнее всего изучать тему на линейном потоке кода, в котором каждая строка непосредственно относится к этой теме.

Во-первых, нужно поблагодарить создателя использованного мной туториала. Взяв его за основу, я избавлялся от всех абстракций, пока не получил «minimal viable program». Надеюсь, она поможет вам начать освоение современного OpenGL. Вот что мы будем делать:

Минимальный WebGL в 75 строках кода - 1

Равносторонний треугольник, зелёный сверху, чёрный в нижнем левом углу и красный в нижнем правом, с интерполированными между точками цветами. Чуть более яркая версия чёрного треугольника [перевод на Хабре].
Читать полностью »

в 9:13, , рубрики: rasterizer, tile-based rasterizer, вершинные шейдеры, геометрические шейдеры, конвейер рендеринга, Работа с 3D-графикой, разработка игр, растеризация, шейдеры

Если вы следили за моей серией постов «Растеризация за одни выходные», но не компилировали и не запускали демо, то для вас станет большим сюрпризом, если я скажу, насколько медленными они оказались. В конце серии постов я упомянул существующие техники, позволяющие ускорить мучительно тормозной растеризатор. Теперь настало время двигаться дальше и посмотреть, как они применяются на практике.

Как часть этого проекта я реализовал Tyler — тайловый растеризатор, который мы проанализируем в данной статье. Моей целью при разработке этого проекта были масштабируемость. настраиваемость и понятность растеризатора для людей, которые хотят немного больше понять в этой теме и поэкспериментировать с ней. Эта статья достаточно сильно связана с тем, что объяснено в серии «Растеризация за одни выходные», поэтому лучше будет прочитать и её. Я не буду предполагать, что вы её изучили, но в статье будет больше высокоуровневых объяснений — я не хочу повторять уже сказанное и то, что можно найти в других источниках.

Краткий обзор

Тайловый рендеринг (tile-based rendering или tiled rendering) — это улучшенный по сравнению с традиционным immediate-mode-рендерингом; в нём render target (RT) разделяется на тайлы (т.е. субрегионы кадрового буфера), каждый из которых содержит примитивы, которые можно рендерить в тайлы по отдельности.

Как работает тайловый растеризатор - 1

Обратите внимание на выражение «по отдельности», потому что оно подчёркивает одно из самых больших преимуществ этой техники по сравнению с immediate-mode: ограничение всех операций доступа внутри тайла буферами цветов/глубин, которые остаются в «медленной» DRAM благодаря использованию отдельного тайлового кэша на чипе.Читать полностью »

в 4:28, , рубрики: dxr, Nvidia RTX, ray casting, ray tracing, z-buffer, Работа с 3D-графикой, разработка игр, растеризация, трассировка лучей
image

Часть 1: обработка вершин

В этой статье мы подробнее рассмотрим то, что происходит с 3D-миром после завершения обработки всех его вершин. Нам снова придётся стряхнуть пыль с учебников по математике, освоиться в геометрии пирамид усечения и решить загадку перспектив. Также мы ненадолго погрузимся в физику трассировки лучей, освещения и материалов.

Главная тема этой статьи — важный этап рендеринга, на котором трёхмерный мир точек, отрезков и треугольников становится двухмерной сеткой разноцветных блоков. Очень часто этот процесс кажется незаметным, потому что преобразование из 3D в 2D оказывается невидимым, в отличие от процесса, описанного в предыдущей статье, где мы сразу же могли увидеть влияние вершинных шейдеров и тесселяции. Если вы пока не готовы к этому, то можете начать с нашей статьи 3D Game Rendering 101.

Подготовка к двум измерениям

Подавляющее большинство читателей читают этот веб-сайт на совершенно плоском мониторе или экране смартфона; но даже если у вас есть современная техника — изогнутый монитор, то отображаемая им картинка тоже состоит из плоской сетки разноцветных пикселей. Тем не менее, когда вы играете в новую Call of Mario: Deathduty Battleyard, изображения кажутся трёхмерными. Объекты движутся по сцене, становятся больше или меньше, приближаясь и отдаляясь от камеры.
Читать полностью »

в 14:39, , рубрики: antialiasing, smaa, Алгоритмы, морфологическое сглаживание, Работа с 3D-графикой, разработка игр, растеризация, сглаживание графики
SMAA: улучшенное субпиксельное морфологическое сглаживание - 1

Данная статья основана на журнале Хорхе Хименеса, Хосе Эчеварриа, Тиаго Соуса и Диего Гутьерреса.

Их демо реализации SMAA можно посмотреть здесь (файл .exe). На моём GTX 960 2GB оно работает вполне нормально.

Старые способы сглаживания (антиалиасинга)

Долгие годы стандартами для реализации сглаживания были методы MSAA (Multisampling Antialiasing) и SSAA (Supersampling Antialiasing). На самом деле, они и по-прежнему обеспечивают наивысшее качество среди всех современных методов сглаживания. Как мы знаем, алиасинг возникает из-за нехватки сэмплов, как на пространственном (ломаные линии), так и на временном уровне (мерцание), обычно рядом с гранями и областями изображения с высоким/низким контрастом. Для борьбы с ним у нас имеются два способа, которые когда-то были единственными решениями: Supersampling и Multisampling. При суперсэмплинге мы увеличиваем изображение, а затем снижаем его дискретизацию до нужного разрешения. Этот принцип отлично работает, потому что распространяется на все аспекты проблемы. При мультисемплинге используется похожее решение. В этом методе каждый сэмпл дублируется на основание определённого коэффициента. При современных больших разрешениях для этого требуются достаточно мощные графические карты. Поэтому нам нужны новые методы сглаживания, как на пространственном, так и на временном уровнях. Все эти методы используют в своей работе один алгоритм — распознавание краёв. Но они выполняют и другие операции.
Читать полностью »

в 9:13, , рубрики: api, css, Firefox, FPS, gpu, open source, Quantum, servo, WebVR, браузеры, дерево визуализации, дерево фреймов, закрашивание вершин, закрашивание пикселей, наложение текстуры, пиксельный шейдер, позиционный контекст, растеризация

До релиза Firefox Quantum остаётся всё меньше времени. Он принесёт множество улучшений в производительности, в том числе сверхбыстрый движок CSS, который мы позаимствовали у Servo.

Но есть ещё одна большая часть технологии Servo, которая пока не вошла в состав Firefox Quantum, но скоро войдёт. Это WebRender, часть проекта Quantum Render.

Весь веб на 60+ FPS: как новый рендерер в Firefox избавился от рывков и подтормаживаний - 1

WebRender известен своей исключительной скоростью. Но главная задача — не ускорить рендеринг, а сделать его более плавным.

При разработке WebRender мы поставили задачу, чтобы все приложения работали на 60 кадрах в секунду (FPS) или лучше, независимо от размера дисплея или от размера анимации. И это сработало. Страницы, которые пыхтят на 15 FPS в Chrome или нынешнем Firefox, летают на 60 FPS при запуске WebRender.

Как WebRender делает это? Он фундаментальным образом меняет принцип работы движка рендеринга, делая его более похожим на движок 3D-игры.
Читать полностью »

Главная   |  Архив новостей  |   Android  |   Google  |   Apple  |   Microsoft  |   Информационная безопасность  |   Веб – разработка
Публикации RSS  |  Комментарии RSS
https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js