Profile

Cover photo
Niklas von Hertzen
Works at Reaktor
Attended Hanken School of Economics
Lives in Helsinki
2,098 followers|320,943 views
AboutPostsPhotosYouTube

Stream

Niklas von Hertzen

Shared publicly  - 
 
Flux inspired reactive data flow using React and Bacon.js
3
victor noagbodji's profile photoNiklas von Hertzen's profile photo
2 comments
 
+victor noagbodji The diagram is from the Flux architecture documentation https://github.com/facebook/flux
Add a comment...

Niklas von Hertzen

Shared publicly  - 
 
Checkout the teaser trailer for our Android game Xenotron!
3
Add a comment...

Niklas von Hertzen

Shared publicly  - 
 
Visualizing 1,000,000+ user clicks with Google Analytics and heatmaps 
3
Vardan Galstyan's profile photo
2 comments
Add a comment...

Niklas von Hertzen

Shared publicly  - 
 
Its always warming to hear these kind of things about the work you do and love doing. Interestingly enough, it was Paul really who recommended me to share more of my experiments publicly 
 
I wanted to make mention of some excellent developers and community beacons of knowledge. if you're into frontend development, here are a few people that you should follow (and invite to speak!)
2
Claudio d'Angelis's profile photo
 
I checked out some of your works, they are really impressive, congrats!
Add a comment...

Niklas von Hertzen

Shared publicly  - 
 
My implementation of CSS shaders with WebGL. Works with current versions of Chrome and Firefox.
CSS Shaders. Introduction. One of the more exciting features for the web which I've been looking forward to some time now are CSS shaders. You might remember when 3D transforms were new and hot, C...
4
1
Add a comment...

Niklas von Hertzen

Shared publicly  - 
 
Put the source code up for my WebGL implementation of GTA, requires Chrome & half decent graphics card.
WebGL GTA. This experiment parses the game files (in their original format) and builds the maps and some of the game objects from the game through WebGL. Some very basic game mechanics and physics are...
5
2
Add a comment...

Niklas von Hertzen

Shared publicly  - 
 
We wrote a 5-part blog series about the story behind the 3D visualization for the Hello World Open competition held last summer.

The races were rendered live, in real-time, with   #javascript  and  #webgl  on #chrome .  For me it was one of the funnest projects I've been part of. Perhaps the most satisfying part of it all was the disbelief the attendees had about the visuals actually running on a browser.

Part 1: http://reaktor.fi/blog/hello-world-open-a-story-in-the-visuals-the-history/
Part 2: http://reaktor.fi/blog/hello-world-open-a-story-in-the-visuals-new-dimensions/
Part 3: http://reaktor.fi/blog/hello-world-open-story-visuals-art-and-assets/
Part 4: http://reaktor.fi/blog/hello-world-open-a-story-in-the-visuals-light-camera-action/
Part 5: http://reaktor.fi/blog/hello-world-open-a-story-in-the-visuals-in-retrospective/
5
Add a comment...

Niklas von Hertzen

Shared publicly  - 
 
Check out the early alpha version of our Android game we've been working on for the past month!
2
Robin Laurén's profile photo
 
Whee! I can blast stuff!
Add a comment...

Niklas von Hertzen

Shared publicly  - 
4
Robin Laurén's profile photoNiklas von Hertzen's profile photoRay Hackett's profile photo
4 comments
 
Is there a working example I can use?
Add a comment...

Niklas von Hertzen

Shared publicly  - 
 
PHP VM written in JavaScript. I'll hopefully write about some of the more interesting differences I found between these languages soon. For now, check out some of the examples or try your own PHP code :). Be aware, lots of bugs still.
php.js. Console · View On GitHub · Tweet. php.js - PHP VM with JavaScript. This library reads PHP code and transforms it into JavaScript code which can be run in the PHP VM in this library, resulting ...
13
6
Michael Stuhr's profile photoNiklas von Hertzen's profile photoTibor Soviš's profile photoThomas Jensen's profile photo
5 comments
 
Wow, interesting project and what a task you've put yourself up to :P
PHP's got to be the worst language to do this kind of stuff with. It has so many weird quirks..
Add a comment...

Niklas von Hertzen

Shared publicly  - 
 
I've been looking forward to CSS shaders (https://dvcs.w3.org/hg/FXTF/raw-file/tip/custom/index.html) for quite some time now, so when there finally were some webkit builds available with CSS shaders working, I started playing around with them. One of the interesting things about CSS shaders is that it faces many of the security issues my html2canvas project (http://html2canvas.hertzen.com/) does, in that it can't or shouldn't grant access to sensitive information, i.e. cross-origin content, user agent data such as visited links, user agent stylesheets and dictionary etc. 

As html2canvas doesn't actually have access to the visual content on the page, but builds a representation of the page based on the values read through the page DOM, it does not leak any data which browsers do not expose within its DOM (https://twitter.com/Niklasvh/statuses/168339210502275072). CSS Shaders on the other hand work directly with the rendered content, so all of the security issues mentioned above are exposed.

There were a number of proposals to address this issue (http://www.w3.org/Graphics/fx/wiki/CSS_Shaders_Security), and the current proposed method is to disallow access to rendered content within the vertex shader completely and only allow blending within the fragment shader. Personally, I found this very dissapointing, not only because it does not address the real issue, but also since it significantly reduces the type of shaders you can produce as there is no access to the rendered content. 

Anonymous rendering, i.e.  rendering without user agent information such as visited links, different form inputs with dictionaries or file paths, and general platform/os information was one of the proposed methods, but was rejected with the following two reasons:

"First, it is a 'whack a mole' exercise. The number of things that would need to be changed to make an anonymous rendering is not clearly identified, and it is unclear if a finite and definite set can be identified. Then, it makes of an odd user experience. For example, from an end-user perspective, the color of visited links would change depending on whether or not a shader is applied. This is not a good user experience."

The first point is valid in that there are a lot of different aspects to take into account. They may not be clearly identified yet, but if some effort would be put into it, I'm sure it would get done. It is noteworthy to point out here that CSS shaders isn't the only thing that would benefit from having a clear definition as to how to do anonymous rendering, as SVG with inline HTML through foreignObject face this very issue (http://robert.ocallahan.org/2011/09/risks-of-exposing-web-page-pixel-data.html).  To avoid having SVG images leak the anonymous data through a canvas, Chrome and Firefox both had drawn SVG images directly taint the canvas, making it unreadable. 

However, starting from Firefox 11 onwards (https://developer.mozilla.org/en/Firefox_11_for_developers#DOM), SVG images could be drawn as images onto a canvas without tainting it. This could be accomplished by having a very restrictive implementation of SVG images, disallowing any external resources and any user agent information (https://developer.mozilla.org/en/HTML/Canvas/Drawing_DOM_objects_into_a_canvas#Security).  This still hasn't been addressed in webkit (compare http://jsfiddle.net/Q48Me/ with Firefox 11+ and Chrome). 

Sooner or later, what defines "anonymous rendering" needs to be clearly defined.  Firefox has managed to put a quite clear distinction on what to exclude in their implementation of SVG images. Instead of simply rejecting the anonymous rendering proposal, perhaps an attempt to create a clear definition as to what defines anonymous rendering should have been created. I'd much rather wait for six months longer to have CSS shaders with access to rendered content than go with a solution of just disallowing access completely. As quoted by +Vincent Hardy  (http://lists.w3.org/Archives/Public/public-fx/2012AprJun/0102.html):

"We think this demonstrates that CSS shaders are still very useful even with the proposed security restrictions and that it is possible to have multiple ways of combining the result of the fragment shader with the original texture (the prototype implements two, a multiply blend and a matrix multiply, but more options are possible)."

I agree that they are still very useful, but very far from as useful as they could have been. The second argument as to why the anonymous rendering was rejected was the "odd user-experience" differeing visited-link colors etc. would create. That is obviously firstly assuming that you do not provide your own styles for form inputs (instead of user-agent defaults), you have visited-link colors, you use images and other content that are not served with CORS headers etc.

If this truely would be of major concern, why not provide an alternative of either using anonymous rendering with access to rendered content, or full rendering with no access to the rendered content within the shaders. It would provide the developers the option to go with whatever process would be more suitable for their content, with the downside of making it even more complex. However, considering that CSS shaders are miles far more complex than your ordinary CSS rules, adding another extra parameter to toggle which rendering method to use there wouldn't in my opinion make much of a difference in the general picture of things.

Although I hope the CSS shaders won't end up being a fraction of what it could have been, I am still excitedly looking forward to them regardless of   which method it uses to render content. I really think they are the biggest thing to come to CSS. 
Abstract. This document describes a proposed feature called "CSS shaders". CSS shaders are a complement to the Filter Effects specification and a solution for its feCustom element. In additi...
3
3
Add a comment...

Niklas von Hertzen

Shared publicly  - 
 
I defended against a #zergrush on Google Search.
3
Add a comment...
Work
Occupation
Software Engineer
Employment
  • Reaktor
    Lead Developer, 2012 - present
  • Cuicca Oy
    Founder, 2015 - 2015
  • Accenture
    2010 - 2012
  • Fortum
    2007 - 2008
  • PldX
    2008 - 2011
Places
Map of the places this user has livedMap of the places this user has livedMap of the places this user has lived
Currently
Helsinki
Previously
Espoo - The Hague
Education
  • Hanken School of Economics
    Information Systems Science, 2007 - 2014
Basic Information
Gender
Male
Birthday
November 22