Live data from Hacker News

Show HN: Termtosvg – Record terminal sessions as SVG animations

github.com

61–70 of 84 posts

Re: Show HN: Termtosvg – Record terminal sessions as SVG animations

#61
post #60

SVG is one of those technologies that never really caught on, even though it would have made life much easier for everyone.

If the standard would have been clear and simple - then maybe yes. But in my opinion it was and still is, a huge mess. It somewhat works now, but ... it is a subset, that works. But it is not evil intention(nor the fault of Adobe or now Microsoft), that the love for SVG is not the greatest.

Re: Show HN: Termtosvg – Record terminal sessions as SVG animations

#62
post #26

The primary casualty of using SVG animations is IE/Edge support; SMIL is not currently planned: https://developer.microsoft.com/en-us/microsoft-edge/platfor... . It would be good to adjust the failure mode so that if SMIL is not supported then at least a meaningful frame (probably the last, though scrolling makes it difficult to decide!) is shown, rather than just a blank rectangle.

Jesus, it's 2018 and they still can't even figure out how to implement animated PNGs? Real browsers had this 10 years ago. What the hell is wrong with Microsoft? Are they really just so incompetent, or is there a more insidious business reason why they don't want more animated formats on the web?

SMIL is something quite different and much more complex, than "animated PNGs"

Re: Show HN: Termtosvg – Record terminal sessions as SVG animations

#63
post #53

Earlier quoted context omitted.

It's good for right-way vs wrong-way demonstrations. If I just copy the text out of my terminal and say "this is how we used to do it; this is how we should do it/will do it now" and paste it in a jira ticket, not many people will take the time to read and understand. Gifs are more accessible I guess.

Maybe it's just me, but I can't stand having to wait to watch someone slowly type something when all I want to to is know the command or understand what some output should look like. Similarly, I've never seen this sort of thing used professionally, just on blogs and project demos.

It really should have a timelinecontrol ..

Re: Show HN: Termtosvg – Record terminal sessions as SVG animations

#64

Earlier quoted context omitted.

Animated SVG animations (really just an svg element + animated css) are significantly smaller, more efficient, and crisper than equivalent GIF animations. I wrote about the difference between the two here: https://hackernoon.com/presenting-your-code-beautifully-fdba... As I explained in the above article, this is already possible with asciinema + svg-term-cli ( https://github.com/marionebl/svg-term-cli ). The one dow…

You're competing with webm / mp4 not gif though. Editing the HTML attribute to width=2000% is pretty sweet however because it's a vector. I'm guessing if the example wasn't in an image tag I could select the text too?

video codecs are not the right tool for this job. Consider subpixel-AA for fonts, partially transparent backgrounds, 4:4:4 instead of 4:2:0 and the ability to zoom as you mentioned.

Block artifacts are really annoying when you try to read something on screen recordings.

And svg texts can be made selectable when not loaded as images, so you could copy straight from the recording.

Re: Show HN: Termtosvg – Record terminal sessions as SVG animations

#65
post #41
post #37

Earlier quoted context omitted.

What about embedding a mini ECMAScript player and apply values to the DOM on the fly ?

I'd rather stick to plain SVG for the animation part, in case ECMAScript is stripped from the SVG for security reasons. ECMAScript might be worth adding for additional features though (play/pause, progress bar, frame seeking...)

Why not `zip blah.zip blah.html` and do it all as a single html doc?

http://pieroxy.net/blog/pages/lz-string/index.html

https://github.com/pieroxy/lz-string/blob/master/libs/lz-str...

~5kb gets you an lz-decoder, and you should be able to pull a bunch of trickery with blobs and compressed strings to get somewhere?

Re: Show HN: Termtosvg – Record terminal sessions as SVG animations

#67
post #22

Earlier quoted context omitted.

> the major issue with SVG animations is that Microsoft doesn't plan to ever include support for them in Edge. And here I thought the Edge team left behind the mistakes of IE.

Edge doesn't have an infinite budget, and they say they've tried to prioritize based on how common the standards are found used in the wild and how active the requests on UserVoice are. Doesn't look like there is even currently a tracked UserVoice for it: https://developer.microsoft.com/en-us/microsoft-edge/platfor...

[deleted]

Re: Show HN: Termtosvg – Record terminal sessions as SVG animations

#69
post #56
post #21

This is pretty awesome. I'm a big fan of both SVG animations and terminal recorders, so this is right up my alley. I previously built a small library called svganimator for creating smooth animations between static SVG images [1], used generated SVG animations to help design the Wayback Machine loading animation [2], and also put together a fairly comprehensive comparison of terminal recording solutions [3]. I'll nee…

My first thought was "this seems neat", and my second thought was: how hard would it be to write a small js script to play back "script"[s] output? Or, to take script output, convert it to some pre-tags and add js animation on top of that... I suppose the main barrier would be lack of recorded timing information in script logs, so either pre-procesding or pause for input (say 50ms/keystroke + 200ms pr return/line-fee…

the timing information you want is what 'ttyrec' is for http://derpi.tuwien.ac.at/cgi-bin/man/man2html?1+ttyrec

Re: Show HN: Termtosvg – Record terminal sessions as SVG animations

#70
post #13

What're people using tools like this for? I see the usage surely when demonstrating something in the terminal - and many times used for showcasing projects and tools. Are you using the recordings for other purposes, like to document work and share progress with your team + manager for instance for work you're doing during a sprint (good for demo'ing things at the end of the sprint too).

I did an experiment a couple of years ago where I wanted to see if I could write code 1 pomodoro a day. I recorded myself in asciinema. It's basically several 25 minute pomodoros of me implementing Core Wars (a VM for machine language programs that battle against each other) in Ruby. I hadn't written Ruby in a while and I was more interested in playing experimenting with a TODO list for being efficient with such a small amount of code per day, so the code is not really fantastic. However, if you are interested I did about 60 pomodoros, I think: https://mikekchar.github.io/core-wars-kata/

It's a super old version of asciinema (I haven't bothered to update it). Also, I recommend increasing the playback speed using the '>' key a couple of times so you don't have to suffer from my pathetically slow typing.

Post reply on HN