Relay doesn't solve for you how you should render your components. Relay is "universal" and doesn't even assume it will be running in a browser context. It focuses only on providing an abstraction to work with GraphQL – the same way React focuses only on rendering. Each library solves one single problem at a time (and hell, both are complex enough problem to solve already).

Because these libraries are very generic, it's now up to the community to solve the "more specific" parts. Just search on NPM and you can find tons of React libraries already, some might help you to solve part of the problem you want to solve.

This article demonstrates one use-case: implementing a component handling the scroll of a list to pull more data of a GraphQL connection with Relay.

🎉 Hooray! We recently released an iOS app called Project September.

This application is built with nice tech stack including React Native and GraphQL. The backend is powered by Scala, a robust functional language, and we use many other cool techs.

This fashion app needed some fancy features: one was demo-ed at last React.js conference with the ability to do localized blur on text over images.

We have developed gl-react to abstract GL in React paradigm – with two companion libraries gl-react-dom and gl-react-native that glues React Native with OpenGL.

Let's first see 2 demos of OpenGL usage in our app, and then we'll write a bit about how it's hard to get animations right.

Last February, I talked about gl-react at React.js conference.

Checkout talks of this conference if you are interested by React subject. I want to thanks the incredible team behind React.js for the awesome conference and giving me the opportunity to come to San Francisco.

This article will cover some more technical detail of gl-react that wasn't explained in the talk.

Also, I'll try to not go TOO MUCH into technical detail neither, because it would take weeks to cover gl-react features and its implementation tricks!

Last Thursday, my talk at React Paris Meetup was about using the functional rendering paradigm of WebGL in React. The library gl-react wraps WebGL in React paradigm with a focus for developing 2D effects, that we need in my current startup, Project September, where I have the chance to develop it.

Slides

^ Sorry guys, you may have notice the blog post date is wrong. I won't change the URL, but thanks to how time works, this will be fixed in one month anyway :-D

ReactEurope conference was to me incredibly inspiring and promising. Yersterday got tons of news and tweets from JavaScript community.

One tweet and blog post by the great @aerotwist got my attention.

I often hear claims that “the DOM is slow!” and “React is fast!”, so I decided to put that to the test: https://t.co/M1RZZiyVT2 🐢vs🐇

— Paul Lewis (@aerotwist) 3 Juillet 2015

I would like to express here my opinion and feedback on using React.

I've been using React for almost 2 years now, and always in performance intensive use-cases, from Games to WebGL.

I've created glsl.io and I'm working on Diaporama Maker. Both applications are built with React and combined use of HTML, SVG, WebGL.

Diaporama Maker is probably the most ambitious piece of software I've ever personally done.

In short, Diaporama Maker it is a WYSIWYG editor for web slideshow (mainly photo slideshows). It is a bit like iMovie with the web as first target. The project is entirely open-sourced.

Currently, I am able to render the whole application at 60 FPS and this is still unexpected and surprising to me (press Space to run the diaporama on diaporama.glsl.io demo). Well, more exactly, this would not have been possible without some optimizations that I'm going to detail a bit at the end of this article.

Last week I finished my JS13K game called "IBEX", an apocalyptic game where you have to help some wild ibex to escape from the inferno.

IBEX received the 16th place (out of 129 games) from the js13kgames jury.

This article is a technical post-mortem about the development of this game in JavaScript / WebGL and how the world is just ruled with cellular automata and computed efficiently in a GLSL shader.

I've just finished and submitted my game for js13kgames, a contest where you have to make a web game in less than 13 kilobytes of a ZIP archive.

PLAY IT HERE / github

I had a lot of fun making this game and I think it is by far the best game I ever finished. It is a bit a continuation of my "antsim" game prototype in the idea that you don't control directly the entities but you are at an higher level with simple interactions.

The game should be performant enough but however require that you have a good hardware to support WebGL and some advanced limits (I used too much uniforms). I'll talk more about the compatibility and performance issues in a next postmortem article.

If it doesn't work for you, please report me a dump of http://webglreport.com/.

Playthrough

I gamejam-ed last weekend to the Ludum Dare theming "Beneath the Surface" (29th edition).

I enjoyed that time a lot. What changed from the previous Ludum Dare for me is that I'm now —and happy to be— a father, and I'm enough trained to wake up at 3am so I could be there attending the beginning!

This article is my diary of this incredible 48 hours past to develop "Anthill", a minimalist anthill simulation game. This postmortem will explain what went right and what went wrong for this compo.

The Game

I haven't played any Ant Simulation Game but I recently played a lot "Banished", an awesome city-building strategy game, and I was inspired by the "assign jobs to people" gameplay of this game.

• Play the Game
• Ludum Dare entry
• Source code

Timelapse

Developing a complete game in 48 hours (including sleeping) is tough, especially that it is also about making the graphics and the music!

The game resulting of these 2 days is more a prototype than a finished game: the simulation remains minimalist and fastly boring, the food is the only resource you have to care about.

Here is a 300x accelerated screencast of the developement of "Anthill":

This article introduces my journey into the JS1K world and a few tricks I've used for my entry "Panzer Dragoon 1k" (source).

Welcome to the world of hacks, tricks and getting-things-done-at-any-price. You will turn the worst JavaScript practices and ugliest JavaScript facts to your advantage. Welcome to the world where coding the bad way is satisfying!

Panzer Dragoon 1k

• Play the JS1K entry
• Source Code

Panzer Dragoon Original Game