Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Fast Image Manipulation
Search
patr1ck
May 11, 2012
Programming
2
500
Fast Image Manipulation
From Cocoaheads SF, May 10th, 2012
patr1ck
May 11, 2012
Tweet
Share
More Decks by patr1ck
See All by patr1ck
Ember.js in 10 Minutes
patr1ck
11
930
Other Decks in Programming
See All in Programming
go test -json そして testing.T.Attr / Kyoto.go #63
utgwkk
1
180
フロントエンドのmonorepo化と責務分離のリアーキテクト
kajitack
2
150
Processing Gem ベースの、2D レトロゲームエンジンの開発
tokujiros
2
110
The state patternの実践 個人開発で培ったpractice集
miyanokomiya
0
150
250830 IaCの選定~AWS SAMのLambdaをECSに乗り換えたときの備忘録~
east_takumi
0
350
Jakarta EE Core Profile and Helidon - Speed, Simplicity, and AI Integration
ivargrimstad
0
270
開発チーム・開発組織の設計改善スキルの向上
masuda220
PRO
17
9.5k
速いWebフレームワークを作る
yusukebe
3
550
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
260
KessokuでDIでもgoroutineを活用する / Go Connect #6
mazrean
0
120
AHC051解法紹介
eijirou
0
640
個人軟體時代
ethanhuang13
0
270
Featured
See All Featured
The Pragmatic Product Professional
lauravandoore
36
6.8k
Docker and Python
trallard
45
3.5k
Git: the NoSQL Database
bkeepers
PRO
431
66k
Why Our Code Smells
bkeepers
PRO
339
57k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Become a Pro
speakerdeck
PRO
29
5.5k
The Invisible Side of Design
smashingmag
301
51k
KATA
mclloyd
32
14k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
185
54k
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.8k
Code Review Best Practice
trishagee
70
19k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
31
2.2k
Transcript
Patrick B. Gibson Tilde Inc. FAST IMAGE MANIPULATION
THE PROBLEM.
THE SOLUTION?
OPENGL.
▪ CoreImage in a Nutshell ▪ Problems with CoreImage ▪
OpenGL in a Nutshell ▪ Using OpenGL with CoreImage Effectively OVERVIEW
▪ Apply effects ( lters) to images ▪ Deferred rendering
▪ GPU powered – with caveats ▪ High-level API ▪ Mac OS X version different from iOS version COREIMAGE
CODE. GITHUB.COM/PATR1CK/ TLDCOREIMAGEDEMO
// Create image CIImage *testImage = [CIImage imageWithCGImage:someCGImageRef]; // Set
the new filter value CIFilter *contrastFilter = [CIFilter filterWithName:@"CIColorControls"]; [contrastFilter setDefaults]; [contrastFilter setValue:[NSNumber numberWithDouble:contrastSlider.value] forKey:@"inputContrast"]; // Apply the filter [contrastFilter setValue:testImage forKey:@"inputImage"]; // Get the results CIImage *outputImage = [contrastFilter outputImage]; COREIMAGE
// Get the context CGContextRef context = UIGraphicsGetCurrentContext(); // Render
the image CGImageRef imageRef = [_coreImageContext createCGImage:coreImage fromRect:coreImage.extent]; // Draw it on screen CGContextSaveGState(context); CGContextTranslateCTM(context, 0.0f, coreImage.extent.size.height); CGContextScaleCTM(context, 1.0f, -1.0f); CGContextDrawImage(context, rect, imageRef); CGContextRestoreGState(context); CGImageRelease(imageRef); COREIMAGE
COREIMAGE
DEMO.
▪ Ludicrous speed ▪ Fully GPU powered ▪ Very low
level API ▪ Steep learning curve ▪ But, ludicrous speed OPENGLES
▪ CAEAGLLayer and EAGLContext ▪ Frame buffer ▪ Render buffer
▪ Depth buffer ▪ Stencil buffer, Accumulation buffer (not used here) OPENGLES
glGenFramebuffers(1, &frameBuffer); glBindFramebuffer(GL_FRAMEBUFFER, frameBuffer); glGenRenderbuffers(1, &renderBuffer); glBindRenderbuffer(GL_RENDERBUFFER, renderBuffer); [_eaglContext renderbufferStorage:GL_RENDERBUFFER
fromDrawable:(CAEAGLLayer *)self.layer]; glFramebufferRenderbuffer(GL_FRAMEBUFFER, GL_COLOR_ATTACHMENT0, GL_RENDERBUFFER, renderBuffer); glGetRenderbufferParameteriv(GL_RENDERBUFFER, GL_RENDERBUFFER_WIDTH, &backingWidth); glGetRenderbufferParameteriv(GL_RENDERBUFFER, GL_RENDERBUFFER_HEIGHT, &backingHeight); OPENGLES
glGenRenderbuffers(1, &depthBuffer); glBindRenderbuffer(GL_RENDERBUFFER, depthBuffer); glRenderbufferStorage(GL_RENDERBUFFER, GL_DEPTH_COMPONENT16, backingWidth, backingHeight); glFramebufferRenderbuffer(GL_FRAMEBUFFER, GL_DEPTH_ATTACHMENT,
GL_RENDERBUFFER, depthBuffer); glBindRenderbuffer(GL_RENDERBUFFER, renderBuffer); glViewport(0, 0, backingWidth, backingHeight); [self drawView] OPENGLES
// drawView glBindFramebuffer(GL_FRAMEBUFFER, frameBuffer); glClear(GL_DEPTH_BUFFER_BIT | GL_COLOR_BUFFER_BIT); [_coreImageContext drawImage:coreImage inRect:self.bounds
fromRect:coreImage.extent]; glBindRenderbuffer(GL_RENDERBUFFER, renderBuffer); [_eaglContext presentRenderbuffer:GL_RENDERBUFFER];
DEMO.
REAL WORLD EXAMPLE: BRESSON
▪ Cheat like crazy ▪ Some CoreImage lters are slow
(CIToneCurve) ▪ CADisplayLink ▪ Do not taunt TLDFastCoreImageView NOTES
THANK YOU.
@PATR1CK GITHUB.COM/PATR1CK/ TLDCOREIMAGEDEMO TILDE.IO