Real Time Multiplayer in HTML5 | Hacker News Reader

Real Time Multiplayer in HTML5

buildnewgames.com

150 pointsEtienneK60 comments

3D gaming in the browser is coming. Interestingly, while in the past people like John Carmack had to get around the limitations of the hardware, in the browser we'll be working around the limitations of the software layers between the game (presumably written in Javascript, using WebGL) and the hardware.

Anyways, I think this is a super interesting line of research and development, I wish I would not be tied up doing other stuff for the next 12 months. I'd love to just take the Quake 1 engine and (try to) implement it in Javascript with WebGL and see what happens. I estimate that's the level of graphics that's ambitiously doable in the browser in 1-2 years, by the time something like this would ship.

EDIT: As helpful commenters point out below, Quake 3 seems doable.

Also see yesterday's post on this topic:

http://news.ycombinator.com/item?id=4258670

I hope this comes as a pleasant surprise then :)

http://media.tojicode.com/q3bsp/

Thanks, that's awesome. And it's from 2009.

Brandon's blog is amazing, and definitely worth reading / subscribing to!

Maro, try this link : http://centrc.com:4005/ It is a proof of concept I did in one evening for the next part of the discussion. It uses Three.js to render the stuff.

It says: "The Facility. Play online. Sandbox." Can't get past that (Enter, ESC, click). FF14 on Win7.

Did you try clicking Sandbox? Thats the only option in that demo atm... but it might only work in chrome as it was a one night test :)

Doesn't seem to work, a title screen shows but clicking etc. does nothing.

FF17 on Linux.

"but it might only work in chrome as it was a one night test" , as above :)

http://www.webgl.com/2011/11/webgl-quake-3-demo/

3D gaming in the browser is here: https://chrome.google.com/webstore/detail/bhoaojooagiaaiidln...

> 3D gaming in the browser is here

That's just in one browser.

If Opera signed a deal with Steam and bundled it in their browser, would all the Steam games now "run in the browser"? Technically in some boring sense perhaps, but it wouldn't be on the web.

Do you know which Chrome-specific feature they are using? I'm not sure, but I expect it's user-convenience features like out-of-spec persistent storage extensions and notifications.

My point is that Skids is a quite high-end 3D game written in JS&WebGL that is playable today. It's a big step up from the dozens of "spinning teapot"-style demos most people have seen come out of WebGL so far. Technically, in some boring sense, it's not "on the web". But, it's great progress and a showcase of what can be done very soon, if not today, in Chrome, FF, Opera and Safari if people start trying. Maybe it'll never be possible in IE or Lynx. But, I'll take what I can get.

> Do you know which Chrome-specific feature they are using?

No idea. But they literally list Chrome as the only supported browser, so this looks pretty Chrome-specific.

There are lots of other impressive 3D JS&WebGL apps out there that are not specific to one browser, most however are tech demos and not fully finished products - I expect that to change before the end of the year though.

So a group of students put this together in a few months: http://littlesquareblock.com/upandabove/

It's a little inefficient and a little ugly, but I think it's pretty cool.

God technology moves so fast. I'd be stupid not to learn this stuff. It could be life changing!

The question remains; When do I have the time to learn this stuff? I was thinking about this for a while. Besides working/planning/coding on my own project, I feel like I don't have much time for this.

I think I'm going about this all wrong though. I should divi up my week into departments. That is, have a few hacking days, a planning day, a maintenance day and a R&D day.

Having one day a week to study new techniques doesn't sound like much, but at least it gets the juices flowing. Its all about balance.

The easiest way is to work on a side project (of your choice) and explore what technologies would be best.

For example, why not try to write a HTML5 game? Even if its something relatively simple like a platformer, you will have opportunity to learn a bunch of technologies and actually have an end product (if you have the stamina)

Good idea. With my pet project (artJutsu) I've already experimented a lot with jQuery's ajax call to asp.Net web services. The results actually changed the way I approach problems at my 9-5.

I should figure out how to incorporate this html5 game dynamic into the site somehow. Perhaps as a chat-game project. Who knows what cool things I can learn from this.

Exposure is the greatest thing a developer can have. It helps spur up innovations. Kinda like a kid with an Erector set.

It seems to be that in your 9-5 you cant play with new stuff and you're learning on your on time and not getting paid for that, start doing it in your job or change job now, you're bringing more value to were you are than they pay to you

i started just making a simple HTML5 game, and kept going at it. Taught me a bunch abt game development, the industry and ultimately founded a startup

Technology doesn't actually move fast - you just haven't been watching this progress over the last 5 or so years. Indeed I've found technology to be slow burning with a large bang. Similar examples are found in start ups, inventions and financial crises. Discontinuities only occur due to inadequate sampling of the information stream.

You're right.

It seems like there's so many places to watch. Its really a coin flip. You can either choose to look one way, or look the other. That is, focus on what you know, or go on a technological safari. I think having a R&D day will help balance this out.

I'm always using new techniques and technologies, but they are only logical progressions in my current scope of knowledge. What I need to really do is to go from A to Epsilon to Z and then to B. At least for one day a week. I just want to be a bit more well rounded and beef up my "bag O' tricks".

Look ... guys ... this is NOT TECH, unless you classify hooking up a sewage pipe at the RV Park as tech too.

This is just another example of fighting through a gross kludgey mess to do something relatively trivial that we already knew how to do, much more robustly and performantly, in other systems.

Any time you see an article titled "X in HTML5" you know you are about to ride the short bus. I recommend learning some computer science.

See also Alan Kay's comments about the Web vs the Internet, recently linked on HN...

I actually wrote the article with this in mind. Lots of people dont know how multiplayer actually works. The demo is 'in html5' because people can try it now in their browser. Also because thats where the sites target market is.

I have no objection to the actual existence of the article. I just think it's important for people to understand this fact, that seems to be increasingly misunderstood these days, that "technology" is about expanding the frontiers of human knowledge. Just because someone types program-like things into a computer doesn't mean what he is typing is technology.

If the defining property of your activity is that you are trying to negotiate messes that other people have made in order to make things happen, where the things you are making happen are not novel in themselves, that is pretty much what working in a bureaucracy is like. So you can think of it as "working in a vast decentralized computer bureaucracy" rather than "working in tech".

How do you propose to make web games? Flash? Read Knuth and then use Flash? Abandon web games because it's too messy for you? Please be more specific about what you propose instead.

If you want to make web games, make web games. That's fine. Just don't be deluded that this is "working in tech". It is not.

It sure as hell is. You have just chosen a definition of technology that differs from the rest of the world.

I agree. It's engineering. There's a difference between launching a spacecraft and use it to do something no one has done before and building a 50km long bridge. Both are incredibly hard and expensive, but one of them is "only" engineering, the other has science as well.

There's no such thing as working in "tech". You are always working in "tech", whether it is using Excel or WebGL. When newspapers call the latter "tech", what they really mean is "new tech".

Programming a 3D multiplayer game in a browser is a re-combination of existing technologies, and therefore not "new tech". (Though of course, new, compared to Excel, but only by a few years.)

Last I checked, science -- not technology -- is about expanding the frontiers of human knowledge. Technology is the reification and application of that knowledge: necessarily a messy thing.

I think I will simply take his comment as a generalisation. The semantics from the dictionary simply state the application of science is technology. i.e Computer science applied, is technology.

I agree whole heartedly, learning the science is key.

I actually really appreciate your comment about bureaucracy The main difference on my end is that I believe "working in a vast decentralized computer bureaucracy" is completely analogous to "working in tech" whether you like it or not. Bruno Latour's book Aramis is a case study in this idea. Brief review of that book here:

http://www.tc.umn.edu/~tmisa/reviews/Latour_Aramis.pdf

Any technologist who believes they're not working in a vast bureaucracy (both of the political kind and the technology itself) is not paying enough attention.

That's your definition of technology. I don't share it.

Are you trying to say that the utilization of existing technologies and concept to create or solve other technological problems (e.g. innovations) not technology or in the field of technology?

Does that mean that my Android phone is not a part of technology since, well, a phone existed long before a mobile phone was made? The GUI OS was "perfected" decades ago. So, the Android OS isn't part of the technology club either? What about using the internet on said device? I gather that it was/is very trivial to just hook up a phone and an OS and the internet and whatever other components of these mobile devices does not constitute it as technology because it should have been straight forward to just hook these things up together.

Basically all Computer Science really is is a collections of 0s and 1s thrown together to make things happen. I guess our minds and imaginations just doesn't compare to a room full of monkeys randomly typing 0s and 1s on a typewriter and having it go through a compiler. I'm sure they'll launch astronauts to the moon fairly soon.

Wikipedia defines technology as "...the making, modification, usage, and knowledge of tools, machines, techniques, crafts, systems, methods of organization, in order to solve a problem, improve a preexisting solution to a problem, achieve a goal or perform a specific function."

But, who knows, Wikipedia isn't always accurate, right?

As for you statement, I guess I'll just deal with riding the short bus. This bus has a lot of fascinating things that are just simply mind-blowing to me. Yes, a lot of concepts existed before. Perhaps even better than what's presented in the blog. But the fact that someone did think of a really cool/elegant way to solve this "gross kludgely mess" and present to us for free is alright by me. I love this type of stuff, no matter how trivial it is. Its really a celebration of the human mind and spirit that we can overcome faults in existing problems. shrugs

Is hooking up your toilet considered technology? This kind of plumbing used to be super-high-tech at one time in human history. I think you would find few people who think of it that way now, though.

Hey, make your own choice about what you want to do with your life and what you want to consider cool.

I have written programs using native OpenGL/DirectX that are over a decade old. You are completely correct in that the technology is not new, in fact it is far inferior. However, the one thing to get excited over (and the only reason I even consider doing this type of development) is the accessibility of the finished product. It is far easier to get people to try out your product, game, whatever when all they have to do is visit a web page.

In addition, the "connected" nature of the web, real time communications aspect of it is exciting. Sure this could be done in C, but the cost of doing it in this type of environment is far less.

So while on a technical level it is not impressive, I wouldn't dismiss it.

I think what jblow is trying to get across is that simply writing an article saying "server side JS and client side packet sending libraries exist" hardly begins to solve the problem of how to implement responsive and robust netcode. Node.js and socket.io are literally technology in the broad sense and make a huge number of things possible, but they offer no help with the hard parts of writing a Real Time Multiplayer game. It isn't relevant, it doesn't facilitate the job, it's the wrong layer of abstraction; at the level of actually making sure your real time game performs well, it is not technology. If the article pointed to an actual netcode library for JavaScript games, then yes, that would be technology.

e: reading jblow's other comments makes me realize he's not talking about this at all. So treat the above as my personal issue with the article.

What open source robust and performant system are you proposing here?

I see anything aside from images and text on the web as a kludge. But it turns out ubiquity and connectivity is so powerful that it trumps almost everything else.

I got 1/3 of the way into the article and said to myself, gosh this sounds just like Valve's Source Multiplayer writeup they did many years ago. Sure enough! The author mentions 1/2 way the work is based off of it.

Yea, their approach is one of many, I found it simplest to try and explain in a shortish article.

Article Author here \o Glad Etienne posted here, for some reason I couldn't find my login for HN.

Socket.io works well, we put together this demo where an iPhone is used as a controller for a browser game http://www.webdigi.co.uk/fun/space

Dead-simple, too. I only have moderate experience with web applications and I found socket.io extremely approachable.

Agreed, i really was blown away the first time I wrote something simple and it just worked... On my phones, my pc and my friends browsers.

This is the exact formula we are using for the rewrite of our poker game (http://pokerrpg.com). We are still beta testing the new poker tables, but so far they are running incredibly smoothly using no plugins, just vanilla Javascript, Node.js, and MongoDB. Glad to see these getting pushed more for games!

If anyone is interested in a live example of a MMORPG built in HTML5, this was a project of mine at my last job: http://play.parallelkingdom.com/

It uses the Cometd javascript and java libraries. In my opinion, you can get very "real-time" feeling games on the web with these technologies.

I been using the same technique for the hobby multiplayer game (http://softpoetry.com/projects/burgers/) I've been working on. Got it running using the same stack on iOS/Android and PCs, so it's a good thing to note that it's not just for web browsers.

Yes good point, the first prototype of an older game ran on mac/windows/linux/android/iOS and browser using impact.js, phonegap, titanium etc. All the usual stuff still obviously works too :)

Looks like this is already happening: http://www.webgl.com/2012/06/webgl-game-cloud-party/

Open web standards, but as far as I can tell, no RSS feed!

(Also, I know it's a Microsoft-funded thing, but the animation in the background of the main page runs very poorly on Firefox.)

Open web standards, but as far as I can tell, no RSS feed!

Looking at the source, reveals:

    <link href="/atom.xml" rel="alternate"
     title="Build New Games" type="application/atom+xml">

With any decent RSS reader you should be able to plug in the blog post URL and let it auto-discover: http://www.rssboard.org/rss-autodiscovery/

Add browser support for RSS discovery (restore it, in the case of Firefox):

Chrome: https://chrome.google.com/webstore/detail/nlbjncdgjeocebhnmk...

Firefox: https://addons.mozilla.org/en-US/firefox/addon/rss-icon/

someone needs to implement Bolo in html5

https://github.com/stephank/orona/

Wish we had read this last November when we started! We're using Pusher for the connections instead of Node.js. Working on switching now.

One thing we've done you didn't mention was using Redis for the game state, instead of writing to the HD most things are handled in RAM. We run the risk of losing the last ~five seconds of data on all running games if the server goes down or something but that's a small price to pay for being able to process most game actions faster than the eye can perceive them.

Our game: real time multiplayer HTML5 version of Risk http://warsocial.com

The game is looking pretty cool! Hopefully the article/demo helps out in some way.

I just realized I physically can't read this post, the pink background hurts my brain. I'll try to find a browser add-on to mitigate that disaster.

Or paste this into your address bar: javascript:void(document.getElementsByTagName("html")[0].style.background='#FFF');

I always have iReader handy for such combat situations. :-)

https://chrome.google.com/webstore/detail/ppelffpjgkifjfgnba...

Reply on news.ycombinator.com