AAA – विश्लेषणात्मक एंटी-अलियासिंग तकनीक

 (blog.frost.kiwi)
1 पॉइंट द्वारा GN⁺ 2024-11-21 | 1 टिप्पणियां | WhatsApp पर शेयर करें
  • rasterization में बनने वाले jaggies और pixel crawling स्थिर इमेज की तुलना में मूवमेंट में ज़्यादा साफ़ दिखते हैं, और लेख WebGL सर्कल डेमो के ज़रिए कई anti-aliasing तरीकों की तुलना करता है
  • SSAA·MSAA·FXAA की अपनी-अपनी अलग सीमाएँ हैं: downsampling की लागत, hardware पर निर्भरता, और post-processing आधारित shape distortion
  • Analytical Anti-Aliasing में, जब shape की गणितीय boundary ज्ञात हो, तो signed distance field से edge तक की दूरी निकाली जाती है और किनारों के आसपास 1-पिक्सेल चौड़ाई में alpha fade किया जाता है
  • पिक्सेल आकार 2D में object और rendering size से सीधे निकाला जा सकता है, लेकिन 3D perspective होने पर dFdx, dFdy, fwidth जैसे Screen Space derivatives की ज़रूरत होती है
  • अतिरिक्त buffer या विशेष hardware के बिना इसे WebGL 1.0/OpenGLES 2.0 में भी लागू किया जा सकता है, लेकिन इसके लिए पूरी shape का SDF चाहिए और 1 पिक्सेल से छोटे high-frequency shapes पर इसकी सीमाएँ हैं

WebGL सर्कल डेमो में anti-aliasing

  • लेख का उद्देश्य rasterization में दिखने वाले jaggies को कम करने वाली कई Anti-Aliasing तकनीकों को देखना है, और अंत में Analytical Anti-Aliasing के implementation का परिचय देना है
  • तुलना में SSAA, MSAA, FXAA, MLAA/SMAA श्रेणी, और AAA शामिल हैं
  • डेमो WebGL canvas पर चलती हुई सर्कल बनाता है, और यह इस आधार पर तैयार किया गया है कि anti-aliasing को स्थिर इमेज से ज़्यादा मूवमेंट में समझना चाहिए
  • उदाहरण canvas डिवाइस की native resolution पर render होता है, और लाल बॉक्स 4x zoom view देता है
  • aliasing उच्च-resolution स्क्रीन पर आसानी से न दिखने की समस्या के लिए Native, 1/2, 1/4, 1/8 render resolution switch दिए गए हैं, और integer scaling का उपयोग किया गया है

बुनियादी सर्कल rendering से बनने वाली समस्या

  • सबसे सरल सर्कल rendering में fragment shader, length(uv) < 1.0 होने पर रंग आउटपुट करता है, नहीं तो discard करता है
  • सर्कल वास्तविक geometry resolution पर निर्भर नहीं होता; shader 4 vertex से बने quad पर यह तय करता है कि कौन-सा भाग सर्कल के अंदर है और कौन-सा बाहर
  • varying vec2 uv हर fragment के लिए interpolated होकर केंद्र 0 और -1 से +1 रेंज वाला coordinate देता है
  • यह तरीका Alpha testing के बराबर है, और length(uv) का मान आगे AAA में इस्तेमाल होने वाले signed distance field से जुड़ता है
  • कम resolution पर सर्कल blocky दिखता है, और चलते समय पिक्सेल पंक्तियों का दिखना-गायब होना, यानी pixel crawling, और wobble बहुत स्पष्ट हो जाते हैं
  • 1/4, 1/8 resolution केवल साधारण enlargement नहीं हैं, बल्कि 3D में छोटे या दूर मौजूद elements को दिखाने वाले उदाहरण भी हैं

SSAA: सरल लेकिन महँगा downsampling

  • SSAA, Super Sampling Anti-Aliasing का संक्षेप है; इसमें पहले बड़ी resolution पर render किया जाता है और फिर उसे छोटा करके downsample किया जाता है
  • उदाहरण implementation (canvas.width / resDiv) * 2, (canvas.height / resDiv) * 2 आकार की texture पर सर्कल draw करता है, फिर उसे standard resolution framebuffer में downsample करके स्क्रीन पर blit करता है
  • 2x resolution rendering में हर output पिक्सेल के लिए 4 input पिक्सेल इस्तेमाल होते हैं, इसलिए memory और computation 4 गुना बढ़ जाते हैं
  • वास्तविक उदाहरण में anti-aliasing तो होता है, लेकिन उम्मीद से कमज़ोर दिखता है
    • transparency के 4 स्तर होने चाहिए, लेकिन देखने में कुछ हिस्सों में केवल 2 स्तर दिखते हैं
    • कम resolution पर 4-step transparency मुख्यतः 45-डिग्री diagonal के पास दिखाई देती है
    • axis-aligned निचले हिस्से में केवल पूरी opacity और 50% transparency दिखती है; 25% और 75% स्तर नहीं दिखते
  • कारण यह है कि सर्कल shape को खुद 2x resolution पर sample नहीं किया जाता, बल्कि पहले से quantized सर्कल परिणाम को फिर से sample किया जाता है
  • उदाहरण implementation 2x resolution texture और linear interpolation का उपयोग करता है, इसलिए व्यवहार में यह 5 गुना VRAM इस्तेमाल करता है
  • सही SSAA में scene को बिना intermediate buffer के कई बार sample करके परिणामों को जोड़ा जाता है, इसलिए rendering pipeline के साथ गहरा integration चाहिए

MSAA: hardware-आधारित sampling के फायदे और सीमाएँ

  • MSAA supersampling का एक रूप है, लेकिन यह मुख्यतः model silhouette, overlapping geometry, और Alpha to Coverage enabled texture edges पर लागू होता है
  • इसका implementation GPU hardware और graphics vendor पर निर्भर करता है, और support का स्तर hardware और driver के अनुसार बदलता है
  • WebGL 1, MSAA को support नहीं करता, इसलिए उदाहरण WebGL 2 context का उपयोग करता है
  • उदाहरण UI में No MSAA, 2x, 4x, 8x, 16x, 32x, 64x और Native, 1/2, 1/4, 1/8 render resolution की तुलना की जाती है
  • gl.MAX_SAMPLES से अधिकतम supported sample count पढ़ा जाता है, और केवल उपलब्ध विकल्प ही enable किए जाते हैं
  • मोबाइल GPU पर renderbufferStorageMultisample() कॉल वास्तव में 4x MSAA पर force की जा सकती है
    • Android में 2x चुनने पर भी driver उसे 4x पर force कर देता है
    • iPhone और iPad में 2x चुनने पर वह 4x बन जाता है, और transparency 50% के गुणकों के करीब values पर round हो जाती है, जिससे उदाहरण में double edge बनती है
  • MSAA hardware पर छोड़ा गया तरीका है, इसलिए हो सकता है कि उपयोगकर्ता का डिवाइस ज़रूरी feature support न करे
  • sampling pattern अनुमान से अलग परिणाम दे सकते हैं, और hardware के अनुसार सर्कल edge की transparency के स्तर “गलत क्रम” में दिख सकते हैं
  • कुछ स्थितियों में यह अब भी बहुत शक्तिशाली है
    • forward rendering
    • बहुत अधिक dense न होने वाली geometry
    • tile-based rendering architecture वाले GPU
  • Rahul Prasad बताते हैं कि मोबाइल पर MSAA, desktop जितना महँगा नहीं होता, और कुछ मोबाइल GPU पर 4x MSAA मुफ्त भी हो सकता है
  • अतिरिक्त सामग्री के रूप में KhronosGroup Vulkan-Samples का MSAA color resolve deep-dive उल्लेखित है

MLAA, SMAA, FXAA की ओर बढ़ता post-processing प्रवाह

  • 2009 में Alexander Reshetov के पेपर ने blocky aliasing इमेज में edges खोजकर, pixel shape के हिसाब से filtering rules लागू कर blocky edges को कम करने का तरीका प्रस्तावित किया
  • यह morphology-आधारित तरीका आगे MLAA तक पहुँचा, और बाद में sub-pixel artifact हटाने पर अधिक केंद्रित SMAA के रूप में सुधारा गया
  • कुछ उपयोगकर्ताओं को MLAA/SMAA श्रेणी बहुत धुंधली लगी, और “vaseline on the screen” जैसा वाक्यांश प्रचलित हुआ
  • post-processing anti-aliasing यह दिखाता है कि अस्थिर hardware support से हटकर AA का प्रवाह shader-आधारित तरीकों की ओर बढ़ा

FXAA 3.11: तेज़ post-processing AA की संरचना और सीमाएँ

  • FXAA, Timothy Lottes का Fast approximate anti-aliasing algorithm है, जो MLAA से प्रेरित है
  • सार्वजनिक रूप से जारी अंतिम संस्करण FXAA 3.11 है, और डेमो 12 अगस्त 2011 को रिलीज़ किए गए संस्करण पर आधारित है
  • डेमो सर्कल scene को Native, 1/2, 1/4, 1/8 resolution पर तुलना करता है
  • डिफ़ॉल्ट सेटिंग्स में FXAA_PC 1, FXAA_QUALITY_PRESET 12, fxaaQualitySubpix 0.75, fxaaQualityEdgeThreshold 0.166, fxaaQualityEdgeThresholdMin 0.0833 का उपयोग होता है
  • FXAA पहले केंद्र पिक्सेल और ऊपर-नीचे-बाएँ-दाएँ की luminance sample करता है, और यदि local contrast threshold से कम हो तो मूल पिक्सेल लौटा देता है
  • अगर early exit नहीं होता, तो यह diagonal luminance भी sample करता है, horizontal/vertical edge direction निकालता है, फिर edge के दोनों दिशाओं में खोजकर उसके सिरे ढूँढता है
  • अंत में pixel coordinate को shift करके texture2D sample किया जाता है; आधिकारिक whitepaper के अनुसार यह केवल edge blur करने वाला तरीका नहीं है
  • सर्कल डेमो में स्थिर अवस्था में edges स्मूद दिखते हैं, लेकिन सर्कल के चलते ही shape distort होने लगती है
    • axis-aligned ऊपर-नीचे के हिस्सों में छोटे उभार आते-जाते दिखते हैं
    • कम resolution पर सर्कल अपनी गोलाई खो देता है और PlayStation 1 graphics की तरह डगमगाता है
  • क्योंकि यह हर पिक्सेल पर केवल 3x3 पड़ोस को देखता है, इसलिए इसे यह पता नहीं चलता कि वह क्षेत्र किसी बड़े सर्कल का हिस्सा है
  • FXAA को अधिक जटिल scenes पर anti-aliasing लागू करने के लिए बनाया गया था और इसमें कई settings और presets दिए गए हैं
  • NeoTokyo° scene का full demo aliased output से luminance channel निकालता है और FXAA लागू करता है, साथ ही सभी preset और setting को नियंत्रित करने की सुविधा देता है

FXAA इनपुट और पैरामीटर शर्तें

  • FXAA_GREEN_AS_LUMA को 1 पर सेट करने पर luma की जगह green channel का उपयोग होता है, और इस स्थिति में RGB इनपुट non-linear color space में होना चाहिए
  • FXAA इनपुट RGB, LDR होना चाहिए, और विशेष रूप से tonemapping के बाद FXAA लागू करना चाहिए
  • यदि FXAA_GREEN_AS_LUMA का उपयोग नहीं किया जाता, तो FXAA चलाने से पहले alpha channel में perceptual space का luma स्टोर करना चाहिए
  • luma की सही गणना होनी चाहिए, तभी FXAA सही तरह से काम करेगा
  • FXAA_QUALITY_PRESET performance और quality के बीच trade-off तय करने वाली setting है
    • 12 default है
    • 15 और 29 highest quality हैं
    • 39 EXTREME QUALITY है
  • fxaaQualitySubpix sub-pixel aliasing हटाने की मात्रा को समायोजित करता है
    • default मान 0.75 है
    • 1.00 अधिक smooth है, और 0.50 अधिक sharp है, लेकिन sub-pixel aliasing कम हटाता है
    • 0.00 बंद स्थिति है
  • fxaaQualityEdgeThreshold उस न्यूनतम local contrast को तय करता है, जो algorithm लागू करने के लिए आवश्यक है
  • fxaaQualityEdgeThresholdMin अंधेरे क्षेत्रों को processing target से बाहर कर देता है
  • यदि पहले से post-processing pipeline मौजूद हो या deferred shading का उपयोग हो रहा हो, तो FXAA का performance cost कम हो सकता है
  • mobile graphics में memory access महंगा होता है, इसलिए यदि FXAA के लिए render-to-texture कॉन्फ़िगरेशन नया बनाना पड़े, तो cost advantage कम हो जाता है

Analytical Anti-Aliasing का मूल

  • Analytical Anti-Aliasing वह तरीका है जिसमें आवश्यक shape पहले से ज्ञात होती है, और pixel को पहले से anti-aliased रूप में draw किया जाता है
  • 2D या 3D shape draw करते समय, shape की boundary को ठीक 1 pixel तक fade किया जाता है
  • उदाहरण में circle को Native, 1/2, 1/4, 1/8 resolution पर compare किया गया है, और यह दिखाता है कि कम resolution पर भी edge smoothing और shape preservation बना रहता है
  • circle-analytical.fs में dist = length(uv) से circle का signed distance field गणना किया जाता है
  • circle boundary के पास के pixel को 1 pixel चौड़ाई में fade करने के लिए alpha = (1.0 - dist) / pixelSizeAdjusted का उपयोग किया जाता है
  • यह तरीका artifact के बिना smooth है, filtering की मात्रा को नियंत्रित किया जा सकता है, और किसी अतिरिक्त buffer या अतिरिक्त hardware requirement की जरूरत नहीं होती
  • यह बिना extension के भी basic WebGL 1.0 या OpenGLES 2.0 पर चलता है
  • 1 pixel smoothing sharp दिखती है, लेकिन screen resolution, size, और circle position के संयोजन के अनुसार axis-aligned 90-degree sides अभी भी flat महसूस हो सकती हैं
  • diagonal pixel आकार √2 px = 1.4142... के आधार पर filtering करने से flat एहसास कम हो सकता है, लेकिन shape बहुत हल्का सा और blur हो जाता है

“Analytical” का अर्थ और SDF-आधारित implementation

  • graphics programming में “Analytical” का मतलब है कि intended shape की संरचना पहले से ज्ञात हो, और उसके mathematical definition पर गणना करके effect बनाया जाए
  • यह शब्द computer graphics में ढीले अर्थ में इस्तेमाल होता है, और context के अनुसार इसके कई मतलब हो सकते हैं
  • implementation signed distance field पर आधारित है, और यह मानता है कि sampling किए जाने वाले हर point से desired shape तक की दूरी ज्ञात है
  • यह जानकारी SDF text rendering की तरह texture में bake की जा सकती है, या simple shape के मामले में mathematical formula से per-pixel निकाली जा सकती है
  • signed distance के अनुसार shape border को fade out किया जाता है, और यदि fade distance को 1 pixel रखा जाए तो smooth edge मिलती है
  • implementation का मुख्य सवाल यह है कि shader को pixel size कैसे पता चलता है, और वह distance के आधार पर blend कैसे करता है
  • यह approach motion-stable pixel-perfection प्रदान करती है, लेकिन traditional rasterization के साथ मेल नहीं खाती, और पूरी shape के लिए signed distance field की आवश्यकता होती है

pixel size की गणना: precompute, dFdx/dFdy, fwidth

  • यदि boundary fade की चौड़ाई को circle radius के 95% जैसे किसी fixed value पर रखा जाए, तो कुछ खास size और resolution पर वह अच्छा लग सकता है, लेकिन size बदलने पर वह ज़रूरत से ज़्यादा smooth हो सकता है या aliasing पैदा कर सकता है
  • pixel size उन समस्याओं में से एक है जिन्हें Screen Space derivatives हल करते हैं
  • dFdx, dFdy, fwidth यह पता लगाने में मदद करते हैं कि कोई विशेष मान screen pixel units में कितना बदल रहा है
  • उदाहरण में distance change को pixelSize = fwidth(dist) या pixelSize = length(vec2(dFdx(dist), dFdy(dist))) से निकाला जाता है
  • Screen Space derivatives 3D perspective सहित transformations को सही तरह reflect करते हैं, लेकिन ये WebGL 1 standard में शामिल नहीं हैं, इसलिए GL_OES_standard_derivatives extension या WebGL 2 की आवश्यकता होती है
  • length() तरीका, dFdx और dFdy से बने vector की लंबाई निकालता है, जबकि fwidth() approximation के रूप में abs(dFdx()) + abs(dFdy()) का उपयोग करता है
  • fwidth() approximation diagonal direction में बहुत अधिक scale हो सकता है, जिससे diagonal पर fade ज़्यादा लागू हो सकता है
  • Unity extension Shapes fwidth()-आधारित AAA को “Fast Local Anti-Aliasing” और length()-आधारित तरीके को “Corrected Local Anti-Aliasing” कहता है
  • 2D में context rendering size और quad size ज्ञात होते हैं, इसलिए pixel size को हर object के लिए सीधे गणना किया जा सकता है
  • उदाहरण gl.uniform1f(pixelSizeCircle, (2.0 / (canvas.height / resDiv))) की तरह height-आधारित pixel size पास करता है, और यह तरीका WebGL 2 या extension के बिना भी पुराने hardware पर काम करता है

alpha blending और step function का चयन

  • fade width निकाल लेने के बाद opacity को adjust करना होता है
  • 2D में Alpha blending एक सरल विकल्प है
  • दूसरा विकल्प MSAA और Alpha to Coverage को साथ उपयोग करना है, और इसका उपयोग 3D scene में सही blending के लिए depth-buffer write की आवश्यकता होने पर किया जा सकता है
  • alpha को distance-आधारित तरीके से fade करना चाहिए, और आम तौर पर start और end के बीच interpolate करने वाला step function उपयोग किया जाता है
  • GLSL anti-aliasing implementation में smoothstep() का अक्सर उपयोग होता है, लेकिन इस संदर्भ में यह 1~2 pixel के भीतर का function है, इसलिए कोई ध्यान देने लायक curve लगभग दिखाई नहीं देती
  • smoothstep() से Hermite interpolation हटाने पर clamped linear interpolation यानी linearstep() मिलती है
  • यदि एक quad में केवल एक shape हो, तो clamp भी हटाया जा सकता है
  • अंतिम alpha को float alpha = (1.0 - dist) / (pixelSize * smoothingAmount); जैसे सरल division से गणना किया जा सकता है
  • performance के लिहाज़ से महंगा भाग अभी भी per-pixel किया जाने वाला division ही है, और modern GPU Hermite interpolation के multiplication और addition को Fused Multiply-Add से optimize कर सकते हैं

quad boundary, MSAA, 0.5-pixel correction

  • MSAA + Alpha to Coverage और rasterizer के बीच एक interaction होता है, जो केवल कुछ hardware पर दिखाई देता है
  • MSAA + Alpha to Coverage का उपयोग करने पर sample count की परवाह किए बिना quad के एक side पर ठीक 0.5 pixel गायब हो सकता है
  • उदाहरण इससे निपटने के लिए SDF में dist += pixelSizeAdjusted * 0.5 के रूप में 0.5-pixel margin जोड़ता है
  • 2D में NV_conservative_raster_dilate जैसी processing को सीधे implement किया जा सकता है
    • vertex shader में quad को 0.5 pixel बड़ा किया जाता है
    • fragment shader में signed distance field को 0.5 pixel कम किया जाता है
  • पेज के 2D demo इसी तरीके से काम करते हैं, और vertex *= size + pixelSize यही भूमिका निभाता है
  • gamma और premultiplied alpha की समस्याएँ भी हर प्रकार के AA में महत्वपूर्ण हैं, लेकिन AAA पर ध्यान केंद्रित करने के लिए इन्हें शामिल नहीं किया गया है

कई आकृतियाँ और 3D विस्तार

  • एक quad के भीतर कई आकृतियाँ बनाई जा सकती हैं, और हर एक पर anti-aliasing लागू किया जा सकता है
  • यदि कई आकृतियाँ हों, तो दोनों आकृतियों का हर पिक्सेल पर मूल्यांकन करना पड़ता है, और intersection बिंदुओं पर भी anti-aliasing बनाए रखने के लिए परिणामों को clamp·weight·sum करना होता है
  • color overlay को अलग pass में ड्रॉ करने की तुलना में, आवश्यक shape output में एक ही बार में रंग भरने की लागत कम होती है
  • 3D उदाहरण में चलती हुई camera और perspective के भीतर रखी गई 2D rounded square का उपयोग किया गया है
  • 3D fragment shader roundedBoxSDF से rounded box SDF की गणना करता है, और length(vec2(dFdx(dist), dFdy(dist))) से पिक्सेल आकार प्राप्त करता है
  • जब camera और perspective matrix multiplication मौजूद हो, तब Screen Space derivatives का उपयोग करके पिक्सेल आकार प्राप्त करना विश्वसनीय होता है
  • सैद्धांतिक रूप से derivatives के बिना fragment coordinates पर inverse perspective matrix को हर पिक्सेल पर गुणा किया जा सकता है, लेकिन इसकी performance लागत अधिक है
  • यदि fade को boundary के केंद्र में रखा जाए, तो छोटे आकार या तेज perspective में shape deformation को कम किया जा सकता है, लेकिन किनारे quad के बाहर निकल सकते हैं जिससे hard edge या clipping हो सकती है
  • NVIDIA ने NV_conservative_raster_dilate extension पेश किया, जो boundary पर अतिरिक्त पिक्सेल प्रदान करता है, लेकिन यह WebGL में उपलब्ध नहीं है और NVIDIA hardware तक सीमित है

वास्तविक implementation के उदाहरण

  • Freya Holmér का Unity extension Shapes इस approach की कार्यात्मक रूप से सबसे परिपूर्ण implementation मानी जाती है
    • यह SDF को MSAA से anti-alias करता है या AAA तरीके से blending करता है
    • इसमें motion blur, shape-respecting color gradients, और 1 पिक्सेल से पतली lines के लिए opacity fade जैसी सुविधाएँ शामिल हैं
    • 1 पिक्सेल से पतली lines के लिए इस तकनीक को Line Thinness Fading कहा जाता है
  • Valve Software ने Orange Box के विकास के दौरान Source engine में signed distance field rendering को व्यापक रूप से अपनाया
    • इसका खास उपयोग Team Fortress 2 के HUD में smooth लेकिन sharp UI elements बनाने के लिए हुआ
    • इसने एक line art shader system विकसित किया, जो fixed-resolution images को high resolution पर upscale करने पर भी smooth silhouette देता है
    • यह outline और drop-shadow भी संभालता है, और 3D space में signboard जैसे world elements पर भी लागू किया जा सकता है
  • Valve ने SIGGRAPH 2007 paper के रूप में implementation सार्वजनिक की, और उस paper में 3D game world के उदाहरण भी शामिल हैं
  • Viktor Chlumský का “Shape Decomposition for Multi-channel Distance Fields” Valve paper के footnote में वर्णित तकनीक को आगे बढ़ाने का एक उदाहरण है
    • संबंधित कार्यों में msdfgen और msdf-atlas-gen शामिल हैं
  • Multi-channel distance field तरीका RGB और median term का उपयोग करके sharp text बनाता है, और alpha channel में पारंपरिक SDF रखकर glow और drop shadow जैसे effects संभालता है
  • CJK अक्षरों को सूक्ष्म विवरण के कारण बड़े texture की आवश्यकता होती है, और बड़े texture को downscale करने पर अपने artifact उत्पन्न हो सकते हैं
  • Hacker News उपयोगकर्ता aappleby के अनुसार Google Maps सड़क segments के लिए capsule shape-आधारित AAA का उपयोग करता है
    • aappleby का कहना है कि उसने यह लगभग 10 साल पहले लिखा था
    • वह बताता है कि Spector.js WebGL debugger से जाँच करने पर streets draw call का shader code shape-dependent blended alpha दिखाता हुआ प्रतीत होता है

SDF तरीके की सीमाएँ और TAA पर चर्चा

  • Yakov Galka ने संकेत दिया कि SDF approach किसी विशेष बिंदु पर SDF को sample करता है, इसलिए यदि SDF में high-frequency components हों तो aliasing हो सकती है
  • 1 पिक्सेल से छोटे circle को rasterize करने पर, केवल इस लेख की approach से aliasing को पूरी तरह हटाया नहीं जा सकता
  • Yakov Galka ने polygonal और bezier shapes को anti-alias करते हुए rasterize करने की एक वास्तविक analytical विधि के रूप में J. Manson और S. Schaefer की Wavelet Rasterization का उल्लेख किया
  • लेख प्रकाशित होने के बाद टिप्पणियों में TAA की आलोचना कड़ी थी, और यह स्वीकार किया गया कि TAA जिन समस्याओं को हल करना चाहता है, तथा वे समस्याएँ जिन्हें दूसरी तकनीकों से हल करना कठिन है, उन पर पर्याप्त चर्चा नहीं हुई
  • Timothy Lottes का कहना है कि वह TAA को एक स्पष्ट तकनीकी evolution मानते हैं, लेकिन motion clarity में इसकी सीमाएँ हैं
  • FXAA 4 एक 2-frame blender था और TXAA से मौलिक रूप से अलग था, जबकि TXAA में MLAA नहीं होता और यह MSAA-आधारित है
  • TAA को बेहतर ढंग से समझने के लिए Inside developer Lasse Jon Fuglsang Pedersen की GDC प्रस्तुति Temporal Reprojection Anti-Aliasing in INSIDE की सिफारिश की गई है
  • AAA को ऐसी तकनीक के रूप में आंका गया है, जो native resolution पर विभिन्न आकारों की आकृतियों को smooth, sharp, और motion-stable तरीके से ड्रॉ कर सकती है

संबंधित पढ़ाई

1 टिप्पणियां

 
GN⁺ 2024-11-21
Hacker News टिप्पणियां

  • मैं ही लेखक हूं, अगर सवाल हों तो जवाब दूंगा

    • Google Maps सभी सड़क खंडों के लिए capsule-shaped AAA का इस्तेमाल करता है। इसे करीब 10 साल पहले मैंने लिखा था :D
    • शानदार लेख है। MSDF fonts की anti-aliasing समझने की कोशिश करते हुए मैंने कुछ दावे देखे थे
      एक दावा यह है कि anti-aliasing sRGB space में नहीं, बल्कि linear RGB space में करनी चाहिए [1] [2], लेकिन एक दावा यह भी है कि दशकों से ऐसा नहीं किया गया, इसलिए fonts उसी हिसाब से correct होते आए हैं और कभी-कभी sRGB बेहतर होता है [3] [4]। linear vs sRGB space anti-aliasing पर आपकी कोई सलाह है क्या
      [1] https://www.puredevsoftware.com/blog/2019/01/22/sub-pixel-ga...
      [2] http://hikogui.org/2022/10/24/the-trouble-with-anti-aliasing...
      [3] https://news.ycombinator.com/item?id=12023985
      [4] http://hikogui.org/2022/10/24/the-trouble-with-anti-aliasing...
    • एक छोटी-सी सुधार: WebGL, WebGL1 से ही MSAA support करता है। हालांकि WebGL1 में यह केवल canvas पर संभव है, sample count को control नहीं किया जा सकता, और बस anti-aliasing को on/off करने भर की सुविधा है
      WebGL2 में भी अभी MSAA texture objects नहीं हैं और केवल MSAA render buffers support होते हैं, इसलिए shader में individual samples को सीधे read नहीं किया जा सकता। custom resolve render pass के लिए यह useful feature है, लेकिन यह सिर्फ WebGPU में संभव है
    • मैं मानता हूं कि upscalers पर निर्भर रहने का हालिया trend कुछ ज्यादा ही बढ़ गया है, जिसके चलते कई AAA games धुंधले और artifacts से भरे नतीजे देते हैं। लेकिन Digital Foundry का यह deep-dive analysis [1] देखने के बाद, यह तर्क काफी convincing लगा कि DLSS जैसी technologies ही ऐसी motion stability और sharpness दे सकती हैं जो मिलती है, और वे SSAA से भी बेहतर हो सकती हैं
      इसलिए अब मेरी सोच “TAA == blur” से बदलकर “TAA + machine learning को सही तरह से इस्तेमाल किया जाए तो आज के 3D games में संभव सबसे अच्छी anti-aliasing” की तरफ हो गई है। आप इसे कैसे देखते हैं, जानना चाहूंगा
      [1] https://youtu.be/WG8w9Yg5B3g
    • यह लेख लिखने में कितना समय लगा, जानना चाहूंगा
      मैंने भी real-time visualization-based blog posts कुछ बार लिखी हैं और उनमें बहुत ज्यादा समय लगा था। फिर भी लगता है कि यही सही दिशा है। content से भरे इस दौर में, भले ही ज्यादा समय लगे, कम लेकिन high-quality content बनाना सबके लिए बेहतर है

  • anti-aliasing से ज्यादा बड़ी समस्या उसके आसपास की चीजें हैं। game settings में चुनने के लिए कई acronyms होते हैं, लेकिन वे एक-दूसरे से कैसे अलग हैं, इसकी लगभग कोई explanation नहीं होती; उनमें से आधे तो मुझे बिल्कुल पता नहीं होते
    बेशक खोजा जा सकता है, लेकिन user-friendliness पर थोड़ा ध्यान दिया जाए तो अच्छा होगा। यह लेख आगे reference के लिए मददगार रहेगा

    • games/graphics निश्चित रूप से technical jargon से भरा क्षेत्र है। अगर wizard नहीं बनना है तो बस settings बदलकर परिणाम देखिए। Dolphin की तरह settings में detailed tooltips जोड़ने का तरीका मुझे पसंद है, लेकिन हमेशा कुछ न कुछ tacit knowledge बची ही रहती है
      meta तौर पर, हाल में मुझे acronyms के खिलाफ माहौल अक्सर दिखा है। मुझे लगता है कि चीजें lookup करना इतना आसान पहले कभी नहीं था। ऐसे acronyms जरूर हैं जो learning में बाधा बनते हैं या gatekeeping जैसा काम करते हैं, लेकिन काम करने के लिए concepts को useful स्तर पर नाम देना जरूरी है, इसलिए games की graphics settings acronyms मुझे काफी reasonable लगती हैं

  • WebGL examples के साथ graphics programming analysis करने का तरीका कमाल का है। यह medium की खूबियों का सही इस्तेमाल करने वाला hypertext है। https://pudding.cool/ पर दिखने वाले लेखों की याद दिलाता है, लेकिन depth इससे कहीं ज्यादा है
    मैं कुछ समय से rendering engine में MSAAx4 इस्तेमाल कर रहा था और हाल में FXAA/TAA implementation पर switch करने के बारे में सोच रहा था, लेकिन अब पक्का नहीं कि सच में switch करूंगा या नहीं। यहां से बहुत कुछ सीखा, और UI elements के लिए शायद analytical approach आजमाऊंगा। graphics programming पर लेख HN पर अक्सर नहीं आते, इसलिए जिन्हें और रुचि है उनके लिए frame analysis articles का यह collection recommend करता हूं:
    https://www.adriancourreges.com/blog/

    • Steve Wittens भी https://acko.net/ पर WebGL मिली हुई math illustrations जैसे इस तरह के कई लेख लिखते हैं
      मेरा खास पसंदीदा लेख https://acko.net/blog/how-to-fold-a-julia-fractal/ है। trigonometric functions और complex numbers के संबंध को समझने में इससे ज्यादा मददगार resource मैंने नहीं देखा
    • TAA मुझे सचमुच पसंद नहीं है। खासकर low frame rates पर ghosting बहुत ज्यादा होती है। ghosting से बचने के लिए मैं अक्सर जानबूझकर धीमे algorithm पर switch कर देता हूं

  • circles और zoomed-in हिस्सों वाले frames जिस तरह message convey करते हैं, वह शानदार है। पूरा लेख बहुत अच्छी तरह पढ़ा जाता है

  • SDF या mSDF भविष्य नहीं, बल्कि पहले से ही काफी अच्छा क्लासिक है
    “हर pixel के लिए सभी Bezier curve segments को solve करना पड़ता है, इसलिए performance काफी गिरती है” वाला हिस्सा मुझे उलटे भविष्य या वर्तमान जैसा लगता है। Slug और DirectWrite पहले से ही अच्छी performance के साथ इस्तेमाल हो रहे हैं
    https://sluglibrary.com/
    https://learn.microsoft.com/en-us/windows/win32/directwrite/...

    • Implicit curve rendering को भी भूलना नहीं चाहिए [0]। Patent जल्द ही expire होने वाला है [1]
      [0]: https://www.microsoft.com/en-us/research/wp-content/uploads/...
      [1]: https://patents.google.com/patent/US20070097123A1/en
    • करीब 20 साल पहले Microsoft Game Studios के लिए Loop/Blinn paper का implementation लिखा था, सोचता हूँ क्या वह अभी भी इस्तेमाल हो रहा होगा
      उसे production level तक ले जाने के लिए सच में बहुत काम करना पड़ा था। उस paper की Voronoi-based tessellation कई Asian characters में pathological रूप से खराब हो जाती थी
    • हो सकता है मेरी याददाश्त पूरी तरह गलत हो, लेकिन Slug में इस्तेमाल होने वाले algorithm पर patent नहीं है क्या?

  • लेख scroll करते हुए NeoTokyo screenshot तुरंत नजर में आ गया। उस corridor में मैं हजारों बार दौड़ा हूँ। कई सालों तक उस mod का server चलाया, और छोटी लेकिन skilled व अच्छी community के साथ सच में बहुत मजा आया

    • इससे भी ज्यादा हैरानी की बात यह है कि वह अभी भी active खेला जाता है। हर शुक्रवार रात एक server भर जाता है, और कभी-कभी शनिवार/रविवार को भी। इसका fanbase काफी dedicated है, और इतने पुराने multiplayer game में ऐसी dedication मैंने नहीं देखी

  • 2D और 3D rendering engines दोनों लिख चुके व्यक्ति के तौर पर एक छोटी-सी बात जोड़ूँ तो, ये दोनों सच में अलग हैं। यह सिर्फ एक dimension बढ़ जाने भर की बात नहीं है; इनके goals, use cases और expectations पूरी तरह अलग हैं
    इसलिए “यहाँ बताई गई हर चीज 3D तक भी extend होती है” कहने के बजाय, मैं कहूँगा कि यह पूरा लेख 2D rendering नहीं बल्कि ज्यादातर 3D rendering के बारे में है। 2D rendering के नजरिए से इस विषय पर अच्छा लेख यह है: https://ciechanow.ski/alpha-compositing/
    3D में जिस पर कोई ध्यान नहीं देता, लेकिन 2D में जो बहुत महत्वपूर्ण anti-aliasing criteria हैं, वे हैं accuracy और bias। उदाहरण के लिए AAA में bias ज्यादा है, इसलिए वह inaccurate है। अगर एक ही shape को एक ही जगह कई बार draw करें, तो वह ज्यादा opaque या dark हो जाता है। MSAA में ऐसा नहीं होता, error bounded रहता है और bias नहीं होता

    • JS/TS में WebGPU-based 3D vector renderer के बारे में सोच रहा था, तभी कल आपका project [0] देखा
      मोटी lines draw करना खास तौर पर दिलचस्प है, क्योंकि यह मुश्किल है [1]। हाल ही में यह [2] भी देखा, और सोचने लगा कि क्या सभी shapes को quadratic Bezier curve segments में बदलकर वह technique इस्तेमाल की जा सकती है। जानना चाहूँगा कि क्या आपको यह pursue करने लायक रास्ता लगता है
      [0] https://github.com/Lichtso/contrast_renderer
      [1] https://mattdesl.svbtle.com/drawing-lines-is-hard
      [2] https://scribe.rip/@evanwallace/easy-scalable-text-rendering...
    • यह मानना मुश्किल है कि यह लेख सीधे 3D पर generalize हो जाता है
      प्रस्तावित solution signed distance field पर निर्भर है, लेकिन सबसे महत्वपूर्ण बात—“किस चीज तक की दूरी?”—को सरसरी तौर पर छोड़ देता है। 2D में यह स्पष्ट है, क्योंकि object और background के बीच boundary, यानी silhouette तक की दूरी मापनी होती है
      3D में object के rotate होने पर self-occlusion हो सकता है, जिससे चीजें जटिल हो जाती हैं। SDF किस आधार पर मापा जाएगा? 3D object का 2D projected silhouette लगातार बदलता रहता है, और उसे simply पहले से compute नहीं किया जा सकता

  • Captain Disillusion का link देखकर अच्छा लगा। मुझे उनके बारे में पता नहीं था, लेकिन उनका काम शानदार है। Video effects में रुचि रखने वालों के लिए direct link: https://www.youtube.com/@CaptainDisillusion

  • लेख अच्छी तरह structured है, लेकिन मुझे लगता है कि TAA पर हमला करने वाला हिस्सा भ्रम पैदा कर सकता है। SDF anti-aliasing किसी भी तरह TAA का alternative नहीं है
    TAA हर तरह की aliasing से निपटता है, जबकि यहाँ सिर्फ edge aliasing की बात है। कई modern games indirect lighting और दूसरे effects के लिए Monte Carlo-based approaches इस्तेमाल करते हैं, और इनके लिए व्यवहार में TAA जरूरी हो जाता है

  • “Mobile chips ठीक MSAAx4 support करते हैं और स्थिति अजीब है। Android पर 2x चुना जा सकता है, लेकिन driver फिर भी 4x force कर देता है” वाला हिस्सा थोड़ा अजीब लगा
    मेरे Android phone पर 2x और 4x का फर्क साफ दिखता है, लेकिन iPhone की तरह ‘rounded’ नहीं दिखता