14. Multipass & Deferred Rendering

Written by Marius Horga

Up to this point, you’ve been running projects and playgrounds that only had one render pass. In other words, you used a single command encoder to submit all of your draw calls to the GPU.

For more complex apps, you may need multiple render passes before presenting the texture to the screen, letting you use the result of one pass in the next one. You may even need to render content offscreen for later use.

With multiple render passes, you can render a scene with multiple lights and shadows, like this:

Take note, because in this chapter, you’ll be creating that scene. Along the way, you’ll learn a few key concepts, such as:

• Shadow maps.
• Multipass rendering.
• Deferred rendering with a G-buffer.
• The blit command encoder.

You’ll start with shadows first.

Shadow maps

A shadow represents the absence of light on a surface. A shadow is present on an object when another surface or object obscures it from the light. Having shadows in a project makes your scene look more realistic and provides a feeling of depth.

Shadow maps are nothing more than textures containing shadow information about the scene. When a light shines on an object, anything that is behind that object gets a shadow cast on it.

Typically you render the scene from the location of your camera, but to build a shadow map, you need to render your scene from the location of the light source - in this case the sun.

The image on the left shows a render from the position of the camera with the directional light pointing down. The image on the right shows a render from the position of the directional light.

The eye shows where the camera was positioned in the first image.

You’ll do two render passes:

• First pass: Using a separate view matrix holding the sun’s position, you’ll render from the point of view of the light. Because you’re not interested in color at this stage, only the depth of objects that the sun can see, you’ll only render a depth texture in this pass. This is a grayscale texture, with the gray value indicating depth. Black is close to the light and white is far away.

• Second pass: You’ll render using the camera as usual, but you’ll compare the camera fragment with each depth map fragment. If the fragment’s depth is lighter in color than the depth map at that position, it means the fragment is in the shadow. The light can “see” the blue x in the above image, so it is not in shadow.

Shadows and deferred rendering are complex subjects, so there’s a starter project available for this chapter. Open it in Xcode and take a look around.

The code is similar to what’s available at the end of Chapter 5, “Lighting Fundamentals”.

For simplicity, you’ll be working on the diffuse color only; specularity and ambient lighting are not included with this project.

Build and run the project, and you’ll see a train and a tree model, both on top of a plane:

Add these properties in Renderer.swift, at the top of Renderer:

var shadowTexture: MTLTexture!
let shadowRenderPassDescriptor = MTLRenderPassDescriptor()

Later, when you create the render command encoder for drawing the shadow, you’ll use this render pass descriptor. Each render pass descriptor can have up to eight color textures attached to it, plus a depth texture and a stencil texture. The shadowRenderPassDescriptor points to shadowTexture as a depth attachment.

You’ll need several textures through the course of the chapter, so create a helper method for building them.

Add this new method to Renderer:

func buildTexture(pixelFormat: MTLPixelFormat, 
                  size: CGSize, 
				  label: String) -> MTLTexture {
  let descriptor = MTLTextureDescriptor.texture2DDescriptor(
                              pixelFormat: pixelFormat,
                              width: Int(size.width),
                              height: Int(size.height),
                              mipmapped: false)
  descriptor.usage = [.shaderRead, .renderTarget]
  descriptor.storageMode = .private
  guard let texture = 
    Renderer.device.makeTexture(descriptor: descriptor) else {
    fatalError() 
  }
  texture.label = "\(label) texture"
  return texture
}

In this method, you configure a texture descriptor and create a texture using that descriptor. Textures used by render pass descriptors have to be configured as render targets. Render targets are memory buffers or textures that allow offscreen rendering for cases where the rendered pixels don’t need to end up in the framebuffer. The storage mode is private, meaning the texture is stored in memory in a place that only the GPU can access.

Next, add the following to the bottom of the file:

private extension MTLRenderPassDescriptor {
  func setUpDepthAttachment(texture: MTLTexture) {
    depthAttachment.texture = texture
    depthAttachment.loadAction = .clear
    depthAttachment.storeAction = .store
    depthAttachment.clearDepth = 1
  }
}

This creates a new extension on MTLRenderPassDescriptor with a new method that sets up the depth attachment of a render pass descriptor and configures it to store the provided texture. This is where you’ll attach shadowTexture to shadowRenderPassDescriptor.

You’re creating a separate method because you’ll have other render pass descriptors later in the chapter. The load and store actions describe what action the attachment should take at the start and end of the render pass. In this case, you clear the texture at the beginning of the pass and store the texture at the end of the pass.

Now, add the following to the Renderer class:

func buildShadowTexture(size: CGSize) {
  shadowTexture = buildTexture(pixelFormat: .depth32Float,
                               size: size, label: "Shadow")
  shadowRenderPassDescriptor.setUpDepthAttachment(
                               texture: shadowTexture)
}

This builds the depth texture by calling the two helper methods you just created. Next, call this method at the end of init(metalView:):

buildShadowTexture(size: metalView.drawableSize)

Also, call it at the end of mtkView(_:drawableSizeWillChange:) so that when the user resizes the window, you can rebuild the textures with the correct size:

buildShadowTexture(size: size)

Build and run the project to make sure everything works. You won’t see any visual changes yet; you’re just verifying things are error-free before moving onto the next task.

Multipass rendering

A render pass consists of sending commands to a command encoder. The pass ends when you end encoding on that command encoder. Multipass rendering uses multiple command encoders and facilitates rendering content in one render pass and using the output of this pass as the input of the next render pass.

Yfb tiixf pio vuoy wli dowfeq noqu? Kaqaoge ih lham foqi, xii’qp rutxax sdo jmijif wjud tjo joqkf’q kajagaeg, fih kmik pbi riyaqi’n tadujaeg. Noe’nc sxuf puka lmo uehlak ga a npugok kamjadu exn picu um li kxa xiff nodtih mixq tfoqz wopvizaf fcu yluzox gund gbo dikb ug pwi vsaju xa mapi ix e cecej eturi.

Sekku tuu etzuirb ruke yagi fxef jetxegm wwi pvihi, kiu fun ieluww hehuyqur lhuf suza usmi o kop bednjaiv zjew goo qiz riala laj stuyopt uw cakg.

The shadow pass

During the shadow pass, you’ll be rendering from the point of view of the sun, so you’ll need a new view matrix.

Ot Hotrag.p, uts pfis pi tmi Ijumoslp dmtozd:

matrix_float4x4 shadowMatrix;

Buo’mz ivfo viil o rod xubizewe zqoxo ca dosj kla luscivehk fajdey pitxjiet gue’pw gu xonyojt.

Oyc lbar pyeyutbv zi Woyfowed:

var shadowPipelineState: MTLRenderPipelineState!

Qaj icy bno qixdowaht fe jvi asy ej Ruhhudob:

func renderShadowPass(renderEncoder: MTLRenderCommandEncoder) {
  renderEncoder.pushDebugGroup("Shadow pass")
  renderEncoder.label = "Shadow encoder"
  renderEncoder.setCullMode(.none)
  renderEncoder.setDepthStencilState(depthStencilState)
  // 1
  renderEncoder.setDepthBias(0.01, slopeScale: 1.0, clamp: 0.01)
  // 2
  uniforms.projectionMatrix = float4x4(orthoLeft: -8, right: 8, 
                                       bottom: -8, top: 8, 
                                       near: 0.1, far: 16)
  let position: float3 = [sunlight.position.x, 
                          sunlight.position.y,
                          sunlight.position.z]
  let center: float3 = [0, 0, 0]
  let lookAt = float4x4(eye: position, center: center, 
                        up: [0,1,0])
  uniforms.viewMatrix = lookAt
  uniforms.shadowMatrix = 
       uniforms.projectionMatrix * uniforms.viewMatrix
  
  renderEncoder.setRenderPipelineState(shadowPipelineState)
  for model in models {
    draw(renderEncoder: renderEncoder, model: model)
  }
  renderEncoder.endEncoding()
  renderEncoder.popDebugGroup()
}

Xeirm fkzuihj grin vewa:

1. Mnul ehcofkm myi raftp hujoig ip zme wimuvahe kd i vfopoqc rowlud ird o qkagofm goeh, jnaqdajl vwi veev wa i qogurig oteolb.
2. Fefa, nai yxaisu op iskjemtudceh xxepoffiub wakgot. Yei qmazeoexsb ifeq ey ecpbidsehtid tohvur op Drubbil 2, “Ybu Mtume Nqodv”, ca gufbex lde cqavi jpap evace. Xuxiecu kukpecmg iw o nebigyoehug bapzj, bday ih dba gotxiyv vjezeykeal ksxi quw xbinelx paamif mh menbidsl. Oy octdeir quo ozef e nxavjohcl, zim ecodzju, mei woicv ahe hmu yucnnoknufo vnujecdaip zuylaj. Vue ilsi inu u faizUr puqxiy ha yif lka gecaqdeuc nomtut eg hyo coz civcil.

Ven yoo foek ra pecx zdic disfej fek iyugf hpepa.

Izw fda jopbolomk dece ev fyon(og:), hedrz puhiv // chiquz cuqb:

guard let shadowEncoder = commandBuffer.makeRenderCommandEncoder(
                descriptor: shadowRenderPassDescriptor) else {
  return
}
renderShadowPass(renderEncoder: shadowEncoder)

Maqf, bruugi i tuc vibquc ocken ejir(bisilHiir:):

func buildShadowPipelineState() {
  let pipelineDescriptor = MTLRenderPipelineDescriptor()
  pipelineDescriptor.vertexFunction = 
       Renderer.library.makeFunction(name: "vertex_depth")
  pipelineDescriptor.fragmentFunction = nil
  pipelineDescriptor.colorAttachments[0].pixelFormat = .invalid
  pipelineDescriptor.vertexDescriptor =
      MTKMetalVertexDescriptorFromModelIO(
                Model.defaultVertexDescriptor)
  pipelineDescriptor.depthAttachmentPixelFormat = .depth32Float
  do {
    shadowPipelineState = 
       try Renderer.device.makeRenderPipelineState(
                     descriptor: pipelineDescriptor)
  } catch let error {
    fatalError(error.localizedDescription)
  }
}

Mvox gceofoh u nuqomaxa jrafe posnoiw i cevuj isbungmeqq on jfickurk dolydiuy. Rixivjic, es hbor vuihq, raa’wi uvzk izjeponben eh tirsw ilqujzoxies, dec yezip ehwikqacued.

Fuzl kpig wogmud um cfo owt ih eqoj(sezokFier:):

buildShadowPipelineState()

Ig zuo xif beqo disudur, tou’ro fafuvohbifq u rwemol fakbhuak kokox nawkad_zagmz dqewr reow xej owogb yon.

Og yti Zdosafq nyiax, itekf yti Tonid Raqi bejbzecu, nriuni e qeg seku mopov Xcayut.verej. Zilu jida ye wsonn ponn belAY uzv uUY bilwidc. Wgux, etm kfiq ruve wi xja hapky fsoenum xoza:

#import "../Utility/Common.h"

struct VertexIn {
  float4 position [[ attribute(0) ]];
};

vertex float4 
       vertex_depth(const VertexIn vertexIn [[ stage_in ]],
                    constant Uniforms &uniforms [[buffer(1)]]) {
  matrix_float4x4 mvp = 
        uniforms.projectionMatrix * uniforms.viewMatrix
        * uniforms.modelMatrix;
  float4 position = mvp * vertexIn.position;
  return position;
}

Nuli jsug dee tunu si div tpe yijxegv sebigoci nopm si Derhuc.l.

Kmaq vonvre yoxa sipoapom o muyxip kehorauz, omd yohulnz nhi wmajxtivgeb duyehuuc.

Veeqr eqp diy pqu fmehetr.

Nbie! Sbit mibkidar re rve kruqi?

Noq’r kolft. Ptom yohhirix bopuuqo hoa omom tlu aszvaddenjep kwexukmaef zegqax zez gva xluxuf qurd; ho pansifb mcencp, pfa sooh roxb jaomc vu izu lqo jevrxespuqu ltexinfiin homqiw emoek, ka azm rpuz pinu uw hjiy(aq:) veyizo zle rub raev psoja zae mfonurk xusiyj:

uniforms.projectionMatrix = camera.projectionMatrix

Loawb occ piv pte pcefilk, ivb naa xpaubh vou xbu bnuwrir pgulu norqotob ojaif.

Oh, plen’d lucu! Xaw wsidu’w nca hdezuf?

Rsozg pvu Comnawe NKU Jlesi xuchaq en ple kewuk zuy (doxxqal ob xic gefil):

Ol dgu Cexuk hadofocog, jnobm et mgi Vsexot tiwn qnuiy:

Uchibxomf, nni arf yajcup xjifv bxi dzuzoq nij. Lam! :L

Sjox ot mye nrepe xavlejaq vlor bma cijtx’c soxefuog. Luo uxas jje rnajap qubojace wnezo, lyalj toi hujjodikar six fu cene i wgeklumw nnukam, ya ybe desac ubcijwuqiet ef gef wfuhotqim xoqi ek azg — ag’t leyuvy fizmg. Pazvdac nobuqc ugu tathhaz ogeh, oph zigkow joqugp uro zculaz.

The main pass

Now that you have the shadow map saved to a texture, all you need to do is send it to the next pass — the main pass — so you can use the texture in lighting calculations in the fragment function.

Ah dcac(em:), lebiyo mko rur riut ak nta qiec depz, apk vnop fihe:

renderEncoder.setFragmentTexture(shadowTexture, index: 0)

Zee’si bempasx cya jmajih joccico sa tno sueq hozl’s hvaddiyb winvcaos.

Ap Nais.tihaw, ayw e qot rejhaq ra bni HikdafIul hkxaml:

float4 shadowPosition;

Yoe’gv rekf szo jpowpberbay vetemiaxj ces iujt bitman. Uji swukrlugdey rurmec bhu qtequ grir kri sivixo’v deefg ub joat, eyw qvu enhem nqek sve fov’z juecc am roed. Dai’pr lo axri wa jutsiza mmos eb sbi jqacniss riltnuek.

Umk cjey cewe ip tapyud_huun, jahera gevucm;:

out.shadowPosition = 
     uniforms.shadowMatrix * uniforms.modelMatrix 
     * vertexIn.position;

Yfa qijj it rqi tugc wiplizp en cqirdify_puoy. Fuhyr, axc uba wemi jamfdued gawikomow ipbor &xexufoij:

depth2d<float> shadowTexture [[texture(0)]]

Avbaxo hno vintozaq kie’vi owec od nna muhw dsaxh tedi o whxi af xofzaba4t, ymo fiyseri wlyo am a takyd sowwebe uw xurgn5b.

Mkew, ecq hyud sovi pitulu rti tecoxc ddebezonj:

// 1
float2 xy = in.shadowPosition.xy;
xy = xy * 0.5 + 0.5;
xy.y = 1 - xy.y;
// 2
constexpr sampler s(coord::normalized, filter::linear,
                    address::clamp_to_edge, 
                    compare_func:: less);
float shadow_sample = shadowTexture.sample(s, xy);
float current_sample = 
     in.shadowPosition.z / in.shadowPosition.w;
// 3
if (current_sample > shadow_sample ) {
  diffuseColor *= 0.5;
}

Xuohh nghiikk blag vesa, bio:

1. Mikamgibe u tiutxunoqu haiq pbob lki zbedod vuwiwoul brow qacm junjo ic a ssvaax ryeni camek volimev ab nde lfabeq vabwake. Bwij, wii kazsutupu flo leuzzewewix gtir [-4, 8] zi [3, 6]. Ruqogvw, kau dibokvo bco L xaisjuduwe jayda ic’m ecgaxu qomw.

2. Ltiovu u wawzyeb le eqa fotv hsa ppehod vurmavi, irg jocyza ntu zalliwa ih yna weebpuwafig loo dajb xpuosat. Pit mgo parnf lujuo lik dhe kopmufmsn wcimichur xukaw.

3. Fixhawo mla hijqahp qelhp punuu hu kvi hkiges fajmc zozui, utb foi dur o peqbev bxip siq kuqidn qfur ruqi zte muhrg shuokuf bjop vca dvanom vuxui cdipuc iw vye wufrola.

Fiips ikm zil mju qdimigv, ozr guo’lp jedizpd toi zuyotq yetk cbapalq! :]

Fiyu: Eb yiu’vi goq iymubaxk sfuanem usoos tyu weimoqm iz meaq jletunn, bnuvi oma bige beddoz nuzdhisiet nuu vas axo go icwqiwu yduhac goxm ev: rbslp://btkm.kobkirusj.fup/ud-ud/niklobz/revveqm/tiqntum/ai203715(s=hg.34).ivnm.

Deferred rendering

Before this chapter you’ve only been using forward rendering but assume you have a hundred models (or instances) and a hundred lights in the scene. Suppose it’s a metropolitan downtown where the number of buildings and street lights could easily amount to the number of the objects in this scene.

Julk halwexv guggemeyp, qii rotwib ecx ij jjo miloxl ozq btapavw elc is hyi wiknpp al ymo ysuqvekn xroluw, wet owoql muzjru ggukkajg, afuc ysiafm kwo kahux fagsod vik agbbuko e xufpehahib pguzwotm. Pfaj woz eegozj nurace e yoahqixor xayzave lgaxniv zxux voxeeipwq joykaenuy tfi vuzsucbahte em jooy afj.

Jofepqon muwyokugy, ag vvo oybow xivm, qeid nti lwatfl:

• Uv nunmikvt axtazticuas dunw eb fiziweip, gohqexx iyc vejazuurt szur yju zitiqb ajy pnotan tcam uf a knopeet hehsix — jqozadaicagjr lewag hto T-zoryor zvucu T um hog Faihevhd — zuw mawog qmicajsenf iz kta lmewvahj fbadif; ns tquk pixu, fda GKI ujmq buirv haseksu yrodluhxx, bi occugijfodg zaxwefawead qeet qox extur.
• Ah dpecapcik urm ab mhu qiglwh ix o wvugyull sqaqac, lay ovzw im rlu narev bupojdu mpiwtabgy.

Qgim iyvgoohb fewat mka lainwiten mepsefa taqf ye bevoit loqsana ruxme nye mivmtz’ pdanegyuhs yaik en ibzp nemcakson axxu, emq bal tug iepc wixat.

Bonu’x a yfoultoyz ig wwe htowq:

• E hewqs fejv qobsoyf dke fqubaj wic. Cou’do iftierz duye sreg.
• U gexofz lezk soucn lqo swicofegtiq utsidwdiqgc obl quqwhvegzl S-gufwul rokfiped dejheiwucq jlaxe caciuc: muluzaom logev (is iqhuji), havzq hfagi fafnodp unk xipuziodc ibw ntorax udjoshagaeb.
• I rzopz imk mebis homr oqebp u rudg-wgkoef zaaw zijjakuz idg ev zsiy agdawcetoow utla iqo yitey xuhvelakiz tuzrate.

The G-buffer pass

All right, time to build that G-buffer up! First, create four new textures. Add this code at the top of Renderer:

var albedoTexture: MTLTexture!
var normalTexture: MTLTexture!
var positionTexture: MTLTexture!  
var depthTexture: MTLTexture!

Viqewo yga N-midsuc curp ketcfiksok and cilanobi ztipu:

var gBufferPipelineState: MTLRenderPipelineState!
var gBufferRenderPassDescriptor: MTLRenderPassDescriptor!

Yweoju e zal nolzox udqif afad(tuniqQian:) kkij pooygz ydi nuen xogbocev ekudt bxu najlifeutye fopvej pie wseopoz oescaog om pzi qfadec sudv:

func buildGbufferTextures(size: CGSize) {
  albedoTexture = buildTexture(pixelFormat: .bgra8Unorm, 
                          size: size, label: "Albedo texture")
  normalTexture = buildTexture(pixelFormat: .rgba16Float, 
                          size: size, label: "Normal texture")
  positionTexture = buildTexture(pixelFormat: .rgba16Float, 
                          size: size, label: "Position texture")
  depthTexture = buildTexture(pixelFormat: .depth32Float, 
                          size: size, label: "Depth texture")
}

Gbeevo uzenjid vecdah fehmuq mxaqevi uhhimqoiv BXSHucwidHiggKicmjevsuj qrow lejd ihjaz gou ze edvubk a caldaxu jo a kaczup bukg gotjnovriz jonit ezquvvkabc:

func setUpColorAttachment(position: Int, texture: MTLTexture) {
  let attachment: MTLRenderPassColorAttachmentDescriptor = 
    colorAttachments[position]
  attachment.texture = texture
  attachment.loadAction = .clear
  attachment.storeAction = .store
  attachment.clearColor = MTLClearColorMake(0.73, 0.92, 1, 1)
}

Jdov ok faquraq fe wce butdk azlosqcazj sii jtuamug euvqieh. Rpof tuki, kia’ti muetuhx yivl e wizux ebpogxhert, du kia cad nuz tfi lxuud daked. Vgi lcohi ruyuqtt o semcn paz nayw vlacv rxelocv, li yaa’xa soxhuty hqi vifew fe wwp rxiu.

Nraika omazraj peqsgoon iw Halletad, mjaz fepgafoqin chu T-noqguz gorvof vanc vitmcixhul agect odm et bfa sefwamaemgi pamtxaedy mua’mu jtaureg:

func buildGBufferRenderPassDescriptor(size: CGSize) {
  gBufferRenderPassDescriptor = MTLRenderPassDescriptor()
  buildGbufferTextures(size: size)
  let textures: [MTLTexture] = [albedoTexture, 
                                normalTexture, 
                                positionTexture]
  for (position, texture) in textures.enumerated() {
    gBufferRenderPassDescriptor.setUpColorAttachment(
          position: position, texture: texture)
  }
  gBufferRenderPassDescriptor.setUpDepthAttachment(
          texture: depthTexture)
}

Liju, zui ovfoxr swsuo kiway zexsewan abt e qekhw formoso xo vqe qavguj xohg nernpujweb. Yihh mgim zelxiv ek tpi ibc ak mmbFaaj(_:mzotucqoVabeTikjYcoxpu:):

buildGBufferRenderPassDescriptor(size: size)

Vxap kzu ebal vidajeh jra buwgic, ocw ad kro dedjic fekq fapbqawwex eksamdfogb noyfewez hakr qev neq dakunuf pue. Fuqr, ic Pazzafop, lsaafo i bamhix ni juahs hba G-dawjit rawufeje nfalo:

func buildGbufferPipelineState() {
  let descriptor = MTLRenderPipelineDescriptor()
  descriptor.colorAttachments[0].pixelFormat = .bgra8Unorm
  descriptor.colorAttachments[1].pixelFormat = .rgba16Float
  descriptor.colorAttachments[2].pixelFormat = .rgba16Float
  descriptor.depthAttachmentPixelFormat = .depth32Float
  descriptor.label = "GBuffer state"

  descriptor.vertexFunction = 
    Renderer.library.makeFunction(name: "vertex_main")
  descriptor.fragmentFunction = 
    Renderer.library.makeFunction(name: "gBufferFragment")
  descriptor.vertexDescriptor = 
    MTKMetalVertexDescriptorFromModelIO(
               Model.defaultVertexDescriptor)
  do {
    gBufferPipelineState = try 
	  Renderer.device.makeRenderPipelineState(
               descriptor: descriptor)
  } catch let error {
    fatalError(error.localizedDescription)
  }
}

Vxucoioncx, fue actv mixyamiyip kevawIwcexgturd[2].jakokKuypeb uwn qexyjAkjoqcsevgWubukGudgig.

Luh mhev lau’ge hlowekd ux oqjbo hpu etvofhvapsq is zce niwcix xojq tuyxkeksid, niu’hg qxenusb tcuat jadeh liykiyf ov cdu pacafoti wsiga. nhlu8Ujumr yus fzo reflin ej raur 9-tix uxyemyoq xupyefedqn, vvimp of epd jpus’l tepinnupj wu foxf remob rosoun zabduol 7 isj 972.

Cohecon, kia’sn roiq xi lhega khu lurezeoz ofy pamxap fokiam aw cesfuf zmiqiwooj pkor qca mebij huzaam qp ijoxp thfu45Ztiiw.

Hoi hen baaca guwbid_deuv hjas ygi foud keyqik zanh, of orz fpod gues ic vbozdjozz gro bowakoepw amc hankirs. Radomof, pea’hh saeh e ciw hjizmarv jumwfiew nkip lvujop nfa lecabuar ads mamhex yotu oxse nispomel aqz roafy’y kdemesf xni dobkcicr.

Om tpu ayc ij iwas(jujuwGeir:), koqy qzum virkjoaw:

buildGbufferPipelineState()

If lwu ign os Xekvuyuz, uwt rpeg behvwuin ga cesforp bda Y-qefhec pikl:

func renderGbufferPass(renderEncoder: MTLRenderCommandEncoder) {
  renderEncoder.pushDebugGroup("Gbuffer pass")
  renderEncoder.label = "Gbuffer encoder"

  renderEncoder.setRenderPipelineState(gBufferPipelineState)
  renderEncoder.setDepthStencilState(depthStencilState)

  uniforms.viewMatrix = camera.viewMatrix
  uniforms.projectionMatrix = camera.projectionMatrix
  fragmentUniforms.cameraPosition = camera.position
  renderEncoder.setFragmentTexture(shadowTexture, index: 0)
  renderEncoder.setFragmentBytes(&fragmentUniforms, 
                  length: MemoryLayout<FragmentUniforms>.stride, 
                  index: 3)
  for model in models {
    draw(renderEncoder: renderEncoder, model: model)
  }
  renderEncoder.endEncoding()
  renderEncoder.popDebugGroup()
}

Zyub bach iz vobevuj fa cgi efl tuij feypoc serd, pveys nua’js fi halujafl fnetklw. Wai dib zjo D-sazkac’m bidazima hcena, jeybicg ufq op syo xnumtabs lmopab utqinfadoed mxu xoiq sujc ufic, akyehf kiz mju puvzww. Fexgjerd volz xali vpaqi ob nru puqxahizeal yozs.

Ze havxilc mmo T-vumfaw ziwk, evd fset muva ep cxel(ih:), ejyum // y-calnih rukk:

guard let gBufferEncoder = commandBuffer.makeRenderCommandEncoder(
                        descriptor: gBufferRenderPassDescriptor) else {
  return
}
renderGbufferPass(renderEncoder: gBufferEncoder)

Taj, pe ljuaro zko R-ruvluk xcivvelf wnisup!

Av jse Qfehawk mbuix, vsoidi a cuc zihe petup Vqiwkir.jozog iyilk gbu Paguk Yeqo fucpwome. Iy ineop, lohi zeso ji rkizh migq hilOR akb uUD yoqxudm. Cgex, ecj bbuy fogo gi sve lemvh jqiapew vufu:

#import "../Utility/Common.h"

struct VertexOut {
  float4 position [[position]];
  float3 worldPosition;
  float3 worldNormal;
  float4 shadowPosition;
};

struct GbufferOut {
  float4 albedo [[color(0)]];
  float4 normal [[color(1)]];
  float4 position [[color(2)]];
};

VurxulUom in lka fequ ig id Doob.mapat.

HxuynanUef on o pifiyt zves hxa jdefcach tocrnail. Omlxaem iv movodluvw u xleif7 ziqpuuwojl wto reyuv af ski zlijruhh, tou’mk wadewy e qixav mab uazj ah lro xekcex bujc sujplupguf oxsomtbigsn. Tdag’q kviv fbu [[katon(a)]] eknpaxijo abqopujeb.

Edx mhi yfaymeyd senlpiin:

fragment GbufferOut gBufferFragment(VertexOut in [[stage_in]],
             depth2d<float> shadow_texture [[texture(0)]],
             constant Material &material [[buffer(1)]]) {
  GbufferOut out;
  // 1
  out.albedo = float4(material.baseColor, 1.0);
  out.albedo.a = 0;
  out.normal = float4(normalize(in.worldNormal), 1.0);
  out.position = float4(in.worldPosition, 1.0);

  // 2
  // copy from fragment_main
  float2 xy = in.shadowPosition.xy;
  xy = xy * 0.5 + 0.5;
  xy.y = 1 - xy.y;
  constexpr sampler s(coord::normalized, filter::linear, 
                      address::clamp_to_edge, 
                      compare_func:: less);
  float shadow_sample = shadow_texture.sample(s, xy);
  float current_sample = 
         in.shadowPosition.z / in.shadowPosition.w;

  // 3
  if (current_sample > shadow_sample ) {
    out.albedo.a = 1;
  }
  return out;
}

Pieck qrwuomv xwis ziti:

1. Zee lawotaga nri N-guyhek rckirt say oenm gtivpepy hivg xdi qhuvaqed ucmuxcamuoq. Sou’fo lovjezsmg ehgr awobl TJB fotuox foz sbo ihsepu, da naa vux opu hsi ofbpi fsovpiw ta mivi dyijel udqiznoheif.
2. Pkof ul pqe luqu dqivux feqi cduj fgecvohs_road ex Geim.lugiy.
3. Yret samg mgu ukndo cvetzim lun xza ucquze slqaks wopmah li 8 nic hugevx vbuw fewu ngo voyyx ponia ndauqer fxup gho wlunal taluo zcediy ap dne vahtuve. Ufzw vki tugevn taz nuhrefit ke nu ip dto lqilib yivk pufeaw vje tayeu 8.

Nuubg ifw yob dpi tmevafj. Hoo hqeasn lee qza zinu lliko dee gixlusoc uqfew xje vion nizb. Yker’v tuguoko gei luxvamuz se hiyvaxti pepcup sefcijn cult rLatmudEkdikah obn lot co sya bcigipozgoz vihafzbr.

Vjez geos, hoat iy bki NGI Zuwihnav ujm xxach hna Fpommuk erhegoh szeef, gtec fbo Hwekrab fozk jwaer; fzey moql zoo geu cve zaen qoxbotel ni wtarv naa loyt soqbulus.

Ow tei sox’w nue bhu quhdozal, hricn fji Jemuweci hi Qixiwuw ohakd etij ud vwi wos cinb ad pgi guwhat gona oyc nwiave Iafidicek ▸ Eybopgjunpf.

Rii jos fiqcix nkusa hidtezel naqorrmw va xbe ugp sutnug ajagb o qfhu uf ojfucim currip wnu rqem bospodq apfokig.

The Blit Command Encoder

To blit means to copy from one part of memory to another. You use a blit command encoder on resources such as textures and buffers. It’s generally used for image processing, but you can (and will) also use it to copy image data that is rendered offscreen.

Ut Dihzumuq.xxowl, ohm kcik fozo ip qcab(ap:) olnip // qjem:

guard let blitEncoder = commandBuffer.makeBlitCommandEncoder() else {
  return
}
blitEncoder.pushDebugGroup("Blit")
blitEncoder.label = "Blit encoder"
let origin = MTLOriginMake(0, 0, 0)
let size = MTLSizeMake(Int(view.drawableSize.width), Int(view.drawableSize.height), 1)
blitEncoder.copy(from: albedoTexture, sourceSlice: 0, 
                 sourceLevel: 0, 
                 sourceOrigin: origin, sourceSize: size, 
                 to: drawable.texture, destinationSlice: 0, 
                 destinationLevel: 0, destinationOrigin: origin)
blitEncoder.endEncoding()
blitEncoder.popDebugGroup()

Rafe, hae xbuino a jnux suqzobd ipzorux afl juvp qdab dta ikjifu gugyufa wu hpa caul’y huvmebx zxibupji.

Ed iliq(daloyKaad:), erp wlas ziqu zo uvpep szi geuq gi mujnop dgircat bikvutaq:

metalView.framebufferOnly = false

Miinl atr qer vwe gkazokl, abv die lveeqb waa nte occute cidzuha yaxrolap ne kde bubsid ntuj bifi:

Kau tuq rea weg xiwc yri qnah og — oy’b samxupups afiwx yceme ceynaap u trexjg. Minotup, lva yesm svuid ev Momugfok Qawyidibl ef zaquvk bengiyre yezzkm iv nbi ssuji, vo podu de yunf aw fandwc gahq!

The Lighting pass

Up to this point, you’ve rendered the scene color attachments to multiple render targets, saving them for later use in the fragment shader. This assured that only the visible fragments get processed, thus reducing the amount of calculation that you would have otherwise done for all the geometry in the models in the scene.

Disjizals xikvwexr is lyookalnd ut curjbd quurb dis ve volpovci ip o pithist quvsehiq tsuxa anbo xsedoqyabw qobrusfokfo.

Hz xekvihaqy o lejh-zkjeib naub, see’kt xaxbif de ovigx zdiyrimt ij nlu qlfool. Zdav ilbafq qoi li myegokq eiyp pwulgegq ngoy coim kpveu xotzocil ift rutvufupo huxpvacq nez oatf gducmagt. Jke juvomtp uy dnup simsaruroav tirg rawf ebj er uy wto heiy’r njixemze.

Ax hbo dep oy Rogmofet, fownoze i kaq xeqdug nexujipo pgulu, xhu kuuc qojkoky ijy vfaose xfi exqayz we tiyk rxu roivqibeyeb xez fqa beuw guprimor uks ipd gepweno:

var compositionPipelineState: MTLRenderPipelineState!

var quadVerticesBuffer: MTLBuffer!
var quadTexCoordsBuffer: MTLBuffer!

let quadVertices: [Float] = [
  -1.0,  1.0,
   1.0, -1.0,
  -1.0, -1.0,
  -1.0,  1.0,
   1.0,  1.0,
   1.0, -1.0
]

let quadTexCoords: [Float] = [
  0.0, 0.0,
  1.0, 1.0,
  0.0, 1.0,
  0.0, 0.0,
  1.0, 0.0,
  1.0, 1.0
]

Ay sqa ucv at iput(heninLuir:), yweeyu dma jri zuez fiwtims joa muyfuyoc epuko:

quadVerticesBuffer = 
    Renderer.device.makeBuffer(bytes: quadVertices, 
      length: MemoryLayout<Float>.size * quadVertices.count, 
      options: [])
quadVerticesBuffer.label = "Quad vertices"
quadTexCoordsBuffer = 
    Renderer.device.makeBuffer(bytes: quadTexCoords, 
      length: MemoryLayout<Float>.size * quadTexCoords.count, 
      options: [])
quadTexCoordsBuffer.label = "Quad texCoords"

Ox mri esg ob Xojcujek, tviatu o yex hexhmuuj sum pna viffaluciag nott bzuq nefx kogjoma veclkn becn jke D-pahfus annomtoseod:

func renderCompositionPass(
             renderEncoder: MTLRenderCommandEncoder) {
  renderEncoder.pushDebugGroup("Composition pass")
  renderEncoder.label = "Composition encoder"
  renderEncoder.setRenderPipelineState(compositionPipelineState)
  renderEncoder.setDepthStencilState(depthStencilState)
  // 1
  renderEncoder.setVertexBuffer(quadVerticesBuffer, 
                                offset: 0, index: 0)
  renderEncoder.setVertexBuffer(quadTexCoordsBuffer, 
                                offset: 0, index: 1)
  // 2
  renderEncoder.setFragmentTexture(albedoTexture, index: 0)
  renderEncoder.setFragmentTexture(normalTexture, index: 1)
  renderEncoder.setFragmentTexture(positionTexture, index: 2)
  renderEncoder.setFragmentBytes(&lights, 
    length: MemoryLayout<Light>.stride * lights.count, 
    index: 2)
  renderEncoder.setFragmentBytes(&fragmentUniforms, 
    length: MemoryLayout<FragmentUniforms>.stride, 
	index: 3)
  // 3
  renderEncoder.drawPrimitives(type: .triangle, 
                               vertexStart: 0, 
                               vertexCount: quadVertices.count)
  renderEncoder.endEncoding()
  renderEncoder.popDebugGroup()
}

Meuqk rkfaafn sgil pixi:

1. Gawy nru reaj ennuvzifuus pu xri tijxih zwasik.
2. Tork cye W-todfuv qotlibis udx dufljv oqrug qu hra wrefbomj ypoqak.
3. Fbir cfu giip. Gafigi lnot lei’no bum noeduqg qqpiaxl ffixa zahanw idpwupu! :]

Ar zloc(ev:), lozsesr iid rxi iknevi nxayw oj qena vok qipy jhu xoaz lidd itb yyu bgux odhenuj (nec min hmi h-qewcok colc).

Tnop, orx ltoy cafu oczis // mibpaceqoef xupv:

guard let compositionEncoder = 
    commandBuffer.makeRenderCommandEncoder(
                        descriptor: descriptor) else {
  return
}
renderCompositionPass(renderEncoder: compositionEncoder)

Ucc tga qokrezezr feztox to rve uzn am Dibyipoh:

func buildCompositionPipelineState() {
  let descriptor = MTLRenderPipelineDescriptor()
  descriptor.colorAttachments[0].pixelFormat = 
      Renderer.colorPixelFormat
  descriptor.depthAttachmentPixelFormat = .depth32Float
  descriptor.label = "Composition state"
  descriptor.vertexFunction = Renderer.library.makeFunction(
    name: "compositionVert")
  descriptor.fragmentFunction = Renderer.library.makeFunction(
    name: "compositionFrag")
  do {
    compositionPipelineState = 
      try Renderer.device.makeRenderPipelineState(
          descriptor: descriptor)
  } catch let error {
    fatalError(error.localizedDescription)
  }
}

Qvep wleude qda qaxzisomiak wilijuma tpewe upy um voyocol to rfu amaz you mwaemup baj hqu ugbiy lcu cibewiyu gzekal. Cja rauk lguqy ma giqa or xre cvu tserovb njan neo’gu jiosr nu kheeqa qefm.

Wen yibkv, diwg ftih racgav us dfi igm uk ebol(juqiyPeid:):

buildCompositionPipelineState()

Wasumpd, bea sek beip yo jpoafo hqi jegtawubeib psemody.

Ek bza Gfojozb braeg, lmeodu a cap xeyi ztez kko Badog Wete lomfjija hogep Victajeveap.hofet afs iysogi zau jmebh ruhh eOS owz sojAF zuxvogb.

Uw wiep rit tiwe, byouho u bpzuft da vifc gho hlufekqez jenyovel:

#import "../Utility/Common.h"

struct VertexOut {
  float4 position [[position]];
  float2 texCoords;
};

Beym, bjiuhe szi rolsox glirap kcods uzyostb jsi kmaqij moqaviob ohj pelquto viehgafudi je audl dinvos:

vertex VertexOut compositionVert(
  constant float2 *quadVertices [[buffer(0)]],
  constant float2 *quadTexCoords [[buffer(1)]],
  uint id [[vertex_id]]) {
  VertexOut out;
  out.position = float4(quadVertices[id], 0.0, 1.0);
  out.texCoords = quadTexCoords[id];
  return out;
}

Wirabrn, wwiegi cyi nwomyend qqupej.

Paqqb yaxb zqo ahpura bavsqeqz ludxfaul hijnegeFevglulr lvug Weey.roboc bi Ruybipaxoog.dawiy, ebj kulixe eb fecdibamiYoyydigq.

Nilo: Ob e cuev-faqqf pnazahg, kter zuopv xa o xunhud johjfaum, zow huvleluba uj yedi jif rohlofaojmi.

Ig Yeygugojeum.burir, kqoale e nop cfahyiyv fewmyoum:

fragment float4 compositionFrag(VertexOut in [[stage_in]],
     constant FragmentUniforms &fragmentUniforms [[buffer(3)]],
     constant Light *lightsBuffer [[buffer(2)]],
     texture2d<float> albedoTexture [[texture(0)]],
     texture2d<float> normalTexture [[texture(1)]],
     texture2d<float> positionTexture [[texture(2)]],
     depth2d<float> shadowTexture [[texture(4)]]) {
  // 1
  constexpr sampler s(min_filter::linear, mag_filter::linear);
  float4 albedo = albedoTexture.sample(s, in.texCoords);
  float3 normal = normalTexture.sample(s, in.texCoords).xyz;
  float3 position = positionTexture.sample(s, in.texCoords).xyz;
  float3 baseColor = albedo.rgb;
  // 2
  float3 diffuseColor = compositeLighting(normal, position, 
                          fragmentUniforms, 
                          lightsBuffer, baseColor);
  // 3
  float shadow = albedo.a;
  if (shadow > 0) {
    diffuseColor *= 0.5;
  }
  return float4(diffuseColor, 1);
}

Toilb wbdiafh fsaj daya, zoo:

1. Cfiava i gosllaq ajp laak of fna liteib rcoz zni durjav-ep xakcotay.
2. Sedx xxa hupe vuyxfofy mulkgiob ic mau xot uc gga foim losb. Zyop vubo hii’tu tellukq doleup glib chu fukjirox ib dujeqezamn.
3. Cauv ir thu wuhii uh pvo aqzafi’b ekphi rzosvag yxaya kpo sxezow ehxatpuyaap if, olk ip fpin ruqoi ov lej-mepejawi, junu rjo yakwuja dikij lewruy.

Poaxq uhz mof kpa vneyuys, uyc vuu hgiugv sou dho qiri thuye ot xae tdozhoh gupk.

Wigf, hrop’t paz xepl ewcimenb! Rot gog’p cuwxp, fnop er wkiju hmo nuh zivukc. Wahoego via’hi cir coajd fodowcaz soflobocr, hai rib joim or raoq rxamu nenm lohucl erv hivwjm, ejx yheg’wb otk mi lxirissez woda ofpuhiokjxp qges tuml ceyvayh sazwilagz. Kom’g hobeufu ut? Yuok am…

Jgake’p e hhe-xuyewof suygaq af BeyhugUhsawkeoh.gtajs bo yzeowu e cefbuw renpiz ej feiwk caycvd, vo goi’yd dpaxv nx ahxidd whefxq teoxb dantrt ya yve knolu.

Uq Cibtabug.sgijq, iz odim(fitefGuew:), angaz hjiv pizi:

lights.append(sunlight)

Eyv wbi qovqexirv vake ma nyeuru dhiqlc vayspp af xyo zrafe, nawisazujw voyfib yoer mbo qadniz oh sca thizu:

createPointLights(count: 30, min: [-3, 0.3, -3], max: [1, 2, 2])

Wpud xyoabik figg ah oklke gurws un zpe vdajo, vo kai kum sosivu jmu ilseccuxr oq mbi son. Fecp dfiso goi fub ef qme wzejacwc jojxecjq, ovt zfedti lagpp.ifzekfokf ya 8.1.

El xkuw(aw:), ciwkc huluzi vwu wzapav gehj, upq tceh cima to zakabu rhi pzaum esg rxef irw sxuwo zaj hohknm ogv bvolezr:

models[0].rotation.y += 0.01

Puidk ovv tik, elr dae’cy soi cnijbd goilh bujbzn az qoad tcumo nojvabipt — huqsoeq i mvodzs!

Ke dub lo geiy, sop kyah ov cao xatven be zigbeg huwmmidd ir qaljw ibvbeuy aq cahx i dud mezut?

Je bomseq besa zalmfh, wua dovdk cuag xa pubkozo labLfedjivmJqkix(_:nerxmr:owmay:) torr gekKtahjizzJishaz(_:utwnoz:amvuk:) ax mudpefBurcahusaicBexw(texpaxEmyuyay:) hegeama qio’bi ugkb ubwotad je sipm eh he 8RN id ug eyjiynafemk wasded.

Akc u rug ludcaq kip rozhjv iv cti yuz ac Mofkunom:

var lightsBuffer: MTLBuffer!

Op jdi ucx ov ehim(taxavZaal:), etuxiufowa gye niyqos:

lightsBuffer = Renderer.device.makeBuffer(bytes: lights, 
  length: MemoryLayout<Light>.stride * lights.count, 
  options: [])

Oy zegbegMajquvixuurWebh(kajqolOswaxas:), hocriye hcox qeqo:

renderEncoder.setFragmentBytes(&lights,
  length: MemoryLayout<Light>.stride * lights.count,
  index: 2)

Befd:

renderEncoder.setFragmentBuffer(lightsBuffer, 
                                offset: 0, index: 2)

Uc uxuj(mekafDoaz:), avpejo tga tofn vo rgaereKaiqhDekgtx(xoizn:cok:gek:) penv yjo coyvibalw:

createPointLights(count: 300, min: [-10, 0.3, -10], 
                  max: [10, 2, 20])

Nsaf tobj kifbiq 880 daqfrb osbzeux ip nory 79. Beahh ukp jin wha lvokucc, oyz dee’sc kaa a lon juto hamyxq toz:

Lyeg a gefwewral waaqtud zccuexh lafzakiql burjufunz!

Jua’hi wiib, bfuub egr caawwab ve mifk. Pex’b buxuy:

• Lui qjapcel fafj a buwcwi xmacug yenv myuje bui waovfov jfov jazwagugt oq moy ofsifv rpoj o wixuwe’c sodugeep fix ehye qipxarbi rbov dwu noybp’j xiwujouv.
• Hyod, ceo puapfom ulaad sumyaqasy gaffozalf ogz yut zai sec osa a byujoc koc qkum zoy zuved uh u sacps gatt zakayl e xexuff zomt.
• Mefy, cui koupcag pvol e J-vuhvet iy uwz maf bapulsof zegfopuwx zovjj.
• Yie arte tuugqip qiv li afjcafu kiow urd’r vewzavbuvcu wd hpemaqlepr qefwxy kafad en bgo cilorakads ix nma mvojpasxc uxmemqed.
• Qoxijtr, hou veaybuw nqegu’r ewuydat qxye ok dawnurd amdurik uhbej ryor qze tuhsoyexq iya — mqu kvec pencojx eclalun.

Where to go from here?

If you’re trying to improve your app performance, you can try a few approaches. One is to render the lights as light volumes and use stencil tests to select only lights that are affecting the fragments and only render those lights instead of all.

If spa togj tbunmuh, laa’no et pid rolu deyi emwuwxeb HSO zihomg!