TraceGL: JavaScript code flow visualisation in WebGL

by rikarends • 13 years ago

210 65 13 years ago

shaunxcode• 13 years ago

This looks incredible. Do you think it would be possible to utilize source maps to allow this to work with coffee (etc) source directly?

rikarends16• 13 years ago

Its theoretically possible, although not easy.

kcbanner• 13 years ago

The name seems like a bit of a misnomer, I only just now realized this wasn't a WebGL debugger.

rikarends16• 13 years ago

Its a GL javascript tracer :) plus there is the domain.

stu_k• 13 years ago

The name also confused me and I thought it would just be for tracing WebGL.

From a developer standpoint it's cool that it's in WebGL. As a developer-user I don't care, it just works well and fast!

I would genuinely suggest de-emphasizing the WebGL except in a behind-the-scenes way.

(I've bought and played with it, and can't wait to chase down a bug!)

supercoder2• 13 years ago

Yeah I agree.

The GL part is just an implementation detail.

As a comparison would be to say - what if it was actually quicker when implemented in the DOM or Canvas ?

Would it then make sense to call it TraceDOM or TraceCanvas ?

If the killer / primary feature of the product is speed then it should really be TraceFast / TraceSpeed / TraceMegaSuperQuick (ok, not great names but you get the idea).

showerst• 13 years ago

The "Get it now" page immediately redirects to a 404 for me. https://trace.gl/undefined/getitnow.html

Firefox 20/Mac

michael_miller2• 13 years ago

The "Get it now page" is https://trace.gl/getitnow.html for me, which works fine.

rikarends16• 13 years ago

Hi i'll do a quick test in firefox, i haven't seen that one yet

rikarends16• 13 years ago

Found it. i'll go fix it.

rikarends16• 13 years ago

Sorry fixed that, clear cache please.

marshray4• 13 years ago

Vote up (down) if you'd ever (never) dreamed of writing this kind of thing yourself. :-) I'll report the number.

EDIT: 5 - 1 = net +4 votes as of 10:23 PDT.

zurn• 13 years ago

Most people can't vote down.

marshray4• 13 years ago

Ah, I guess I can only do so sometimes as well. So feel free to leave a comment, I'll register your downvote then you can delete your comment.

This experiment in ad-hoc polling is kind of showing the limits of the idea.

krsunny• 13 years ago

I cant vote down and Ive been here for about a year.

seanmcdirmid2• 13 years ago

What if you dreamed of it, wrote it, then decided the approach wasn't viable given UX concerns?

TheEskimo• 13 years ago

This is a bad idea. I believe that hn actually will weight every comment you make based on your total karma to a degree. I've certainly heard people make anecdotal claims that if they have a lot of karma their comment, even if not heavily upvoted, appears near the top frequently.

This algorithm makes sense. Since upvotes are supposed to mean something like "I want to see more comments of this type and quality", it is giving the majority what they want to promote people who typically make such contributions.

As soon as you try to value an upvote as something different (here as an impromptu poll) you damage the entire system. What if I would dream of this but don't want to see more comments like yours since it's effectively spam? What if I like the idea and want to upvote it for visibility but would 'never dream' of this somewhat specialized idea?

The point I'm trying to make is that this is a bad idea without even going into how incredibly inaccurate such a poll is. This comment will not give any useful data, actively "abuses" hn's value system by asking for upvotes, and doesn't breed meaningful or intelligent discussion. Good for you I can't downvote yet :-). (notice how I added a smiley so that it would seem childish but friendly? Excellent tactic!)

If you want to do a poll I believe the polling option google docs provides will be much better suited (if perhaps slightly tainted by evil).

marshray4• 13 years ago

Agree in principle, but

> As soon as you try to value an upvote as something different (here as an impromptu poll) you damage the entire system.

I'm a hacker and it was an experiment in trying to make the system do something beyond its advertised capabilities. At the end of the day, net 9 upvotes didn't "damage the entire system".

> What if I would dream of this but don't want to see more comments like yours since it's effectively spam? What if I like the idea and want to upvote it for visibility but would 'never dream' of this somewhat specialized idea?

I think you're taking this more seriously than it was intended.

What we learned was:

A. There are several others who had, in fact, dreamed of making this kind of system. But for whatever reason didn't execute on the idea.

B. This mechanism of polling has some limitations. A built in method for commenters to do an impromptu poll in the comments could be an interesting addition to HN.

> Excellent tactic!

Thank you :-)

marshray4• 13 years ago

10 - 1 = net +9 votes as of 2013-04-24 09:28 PDT. Calling that final.

Feel free to take back your upvotes if you feel my karma was undeserved.

kurd_debuggr• 13 years ago

There is a pricetag that comes with the software, which is definitely not in line with the typical javascript ideology, in my opinon.

rikarends16• 13 years ago

I'm against showing banners in my app ;)

United8572• 13 years ago

Why not open source it like most other JS tools? You've built on top of other open-source such as node.js. Just a matter of good citizenship in the JS community.

paraboul• 13 years ago

which is definitely not in line with the typical hipster ideology, in my opinon.

FTFY.

Seriously, I don't get it.

Too• 13 years ago

This debugger is unlike anything i've ever seen. Not charging for it would be plain stupid. Reverse debuggers for other languages usually cost tons.

seanmcdirmid2• 13 years ago

Visual Studio Ultimate with Intellitrace costs a lot, depending on who you ask.

supercoder2• 13 years ago

Well maybe it's a new trend for the better then.

ajtaylor• 13 years ago

This is an incredibly useful tool! I was trying to decide how the huge amount of logging was handled in the display when he mentioned using WebGL - a cool idea to this WebGL newbie. Then there is the ability to jump up and down the stack, even through callbacks. This feature alone would be worth 15 EUR because you don't have to set breakpoints in the browser's web inspector to see exactly what is called and how - you just run the program and then look up the traces!

I wonder how hard it would be to have the browser's native inspectors do the same thing?

michael_miller2• 13 years ago

This is an amazing app, extremely underpriced for what it delivers! One thing I'd love to see is the ability to do profiling, so I can see exactly how much time was spent in each function invocation.

bsimpson2• 13 years ago

We need line_profiler.py for JavaScript.

DanielRibeiro• 13 years ago

It is also nice to see how much great work is going on WebGL these days[1]. Hopefully, tools like this will help even more create amazing things with it.

[1] http://metaphysicaldeveloper.wordpress.com/2013/04/23/webgl-...

saejox• 13 years ago

Name of the app threw me off. I thought this was designed to attach to GL context and show that is actually happening. Like Nvidia PerfHud.

Here is some criticism:

- Your site straight up asks for my credit card number. Small line below "Secure connection using Paymill GmbH" not enough for me to trust you. Believe it or not PayPal or Amazon Payments would work better. At least i can get a refund that way.

- Where is the demo? I'm getting ripped off ?

- I hate when people compare price of their products to a commodity. I don't know how much coffee cost in your world but i can buy 100 cups of coffee where i live. This kinda of comparisons always comes from the bunch that creates long lines at Starbucks. Just don't assume 15 dollars aren't that much. That's half the money i make in a day.

rikarends16• 13 years ago

Hi Saejox, - the name came from the domain, since its a GL UI it fits well enough imho. - tried to make it 'as simple as possible to buy' using the same way Stripe does it (i dont touch CC's) - can't solve international wage/price discrepancies, unfortunately. - i tried to pick a payment solution that didnt' suck too much to integrate, paymill is 'the stripe competitor in europe' and its a pretty clean process compared to paypal. And then there is bitcoin too. - As its not a trivial product i decided to make a video demo to show what it can do.

Thanks for your feedback.

nym3• 13 years ago

For what it's worth, I probably wouldn't have paid with a credit card (too much hassle!) but since I could pay with bitcoin you converted me into a customer.

Thanks for accepting bitcoin!

rikarends16• 13 years ago

Thanks :) I just added it this morning. Now if only coinbase payment callbacks would work, it would be much faster (not manual.)

nym3• 13 years ago

Cups and Cakes Bakery uses BitPay.com- check out our video of it in action. Payments are verified in about 30s-1m

http://www.youtube.com/watch?v=jCYE4V6C8a8

Also, Kai Ryssdal did a segment on us! marketplace.org/topics/business/cupcakes-meet-bitcoins

seddona• 13 years ago

Looks great, just purchased.

+1 for coffeescript/source maps, we do everything in Coffee.

+1 for charging, i hope you get the support to work on this full time. Maybe consider an open source basic / premium closed version though.

+1 for a sublime plugin that does code completion/inspection based on previous runs of the code.

Nice work!

nym3• 13 years ago

+1 for typescript instead of coffee.

shurcooL• 13 years ago

That looks like an awesome tool, good job.

You said you use VBOs for text rendering. Do you use some library for text rendering or is it just coded from scratch?

rikarends16• 13 years ago

I'm rendering font-textures using canvas, and using GL POINT sprites with x+y+texture offsets (the ascii) in the vertexbuffers to store text.

georgecalm• 13 years ago

Well, I'm completely blown away by this tool. The utility of it. The speed... Amazing.

I think it's great that the developer decided to charge money for this too. It has real value for me, it's going to save time, so why wouldn't I want to pay to show my appreciation and to ensure it's being worked on?

skrebbel• 13 years ago

Pardon the off topic and probably downvoted-into-oblivion comment, but

Rik, je bent een botpad.

Yuioup• 13 years ago

Wie is Rik en wat is een botpad?

rikarends16• 13 years ago

thanks :)

ncrit• 13 years ago

This looks nice! Watching the video I was just wondering if it would be more useful if all code that is executed would be highlighted instead of the 2 colors for conditionals. That way one could identify the actual code path more quickly.

TraceGL: JavaScript code flow visualisation in WebGL

Related Stories