New TypeScript Website | Hacker News Reader

New TypeScript Website

devblogs.microsoft.com

94 pointsGarbage55 comments

May I suggest changing the name from 'Typescript Playground' to something like 'Typescript Sandbox'? I found myself on a very nsfw website at work after clicking on a link shown in the results of a search using the strings 'TS' and 'Playground'.

This has happened to me multiple times as well.

Try going to python.com to see what happens :p

Nothing beats LaTeX. Image searches for symbols destroyed many innocent mathematicians.

Try searching "LaTeΧ".

(That's a "Chi" not an "Ex")

Are their web services powered by Python at least? I am more surprised I never accidentally went to this site honestly.

I couldn't get this to happen with Google — every result was for typescript. I tried using duckduckgo and every result but one was porn.

Guess I can put off that decision to switch to ddg a bit longer…

I tried "typescript playground" and thought you were full of it because all of the results were relevant.

Then I tried "ts playground". Woof. That is a big no-go!

I definitely recommend being specific and explicit (in your phrasing...) with ddg still.

Same for me. There's the benefit of user tracking, I guess. I definitely Google for docs frequently so it makes sense to tailor the results for the language.

Unless Google is noticing my IP and doing user tracking in Firefox Private tabs, it's not user tracking. It's just understanding the query better.

Only if you have the "Safe Search"-Option set to "moderate" (default) or below. If you set it to strict, typescript appears as the second result for me, without porn (but still a few links that I wouldn't want to click).

For me first page of Google results were about typescript (except for one imdb entry) in both normal & private mode, but image & video search had nothing to do with typescript. Safe search was off.

Location probably plays a part in the normal search.

Yes. From France the first link is about typescript, then porn all the way

It is funny how do many people jumped on the search "for research" and proudly report back on the typescript vs porn ratio.

Get to peer a little deeper

Hahaha this brings back memories. Back in the 90s I had a homepage on Angelfire.com. I was in high school at the time and I would work on the homepage during lunch in the school library if a computer was available.

I walked into the library one day and all three computers were taken, but right before I turned around to leave, somebody got up and freed up the middle computer. I quickly darted over to it before someone else had the chance. I sat down and because my adrenaline was slightly going, I typed in Angelfire.com really fast, ready to start building. Only it was anglefire.com, a hardcore porn site with flashing green banners and gifs, VERY noticeable. I was so confused as to what the fuck just happened that I froze for several seconds - staring at the screen in disbelief - before it occurred to me to close the god damn browser idiot! I remember going into a full-on panic; nausea, heart-racing, the works.

I was sure I got caught and would be expelled. There's no way it went undetected. I was surrounded by two people to my sides, six people at the circle desk behind me, and the librarian working at the shelf behind them. Somehow during those many seconds of just staring at the screen in a panic, not a single freakin person noticed! I couldn't believe it.

Now you would think I would be thankful nothing bad came of it and learned a valuable lesson, but being the opportunistic teenager I was, I took note how everyone was so entrenched within their own personal bubble. They wouldn't notice anything I was doing at those computers. I eventually used that knowledge to hack the security software on there and install a key-logger...

It's a good idea, and I did consider it, but it's been "playground" for 7 years and even third party versions kept the playground name to let people know it's a REPL. Breaking that is a pretty big change which I opted to not do.

Your choice of naming matches mine too, the abstraction which lets anyone build their own TS repl is called the sandbox: https://www.typescriptlang.org/dev/sandbox/

> To give a sense of the support matrix, here's what we account for with each page:

> - JavaScript being disabled

> - Keyboard-only navigation

> - Text-to-Speech users

> - Cookies/Local Storage being denied

> - A focused mobile navigation design

> - Light and Dark OS mode support, with a user-preference switcher

Now we are talking.

@every_web_developer_and_website_owner : this is the new trend, just trust me. Start preparing now and you'll be ahead of the curve when this Javascript everywhere fad finally goes away early next year ;-)

You really think Javascript is somehow going to die next year? Percent of users with JS turned off is usually under 1%.

It was a joke on my wishful thinking.

https://www.typescriptlang.org/docs/handbook/react-&-webpack... now redirects to https://webpack.js.org/guides/typescript/. It is a shame because this page was really well written.

Typescript is still one of the few languages where the official website is the best place to learn about it.

It's great that the samples are automatically run through the production typescript compiler as part of building the static documentation pages, so all output and error messages are current. It boggles my mind how many places treat technical docs as a write-once effort and then end up damaging their relationship with users as their docs get steadily less and less correct over time.

Absolutely agree: this is critical (I do the same myself in the documentation for my TS/pg library, https://jawj.github.io/zapatos/).

Putting Deno project on the Typescript website frontpage is the most prominent advertising for it that I've seen. Nice! It does look really promising. Has anyone tried doing anything substantial with it?

I would love for MS to get behind Deno as a sponsor to foster growth in a mainstream Node-alternative. (Though I wish Deno would offer shared-mem concurrency, possibly w/green threads as a performant option to workers or clusters.)

I am currently working on porting some sound libraries from Node at the moment. The builtins like deno fmt and bundling make it a joy to code in. Some of the tooling is not yet complete though, for example deno lint is still missing quite a few rules.

I enjoy Microsoft blogs where the screenshots are from MacOS and not Windows. I have no social commentary, it's just a tee-hee :D

And the screenshot on VSCode page shows Linux version. Emphasis on non-Windows applications may be intentional.

In this case I believe it’s up to the blog author. Orta is a Mac user (was involved in a package manager, Homebrew? I forgot). The VSCode goes as far as detecting the OS you’re on and shows the most relevent screenshot, so you get Windows on Windows, Mac on Mac and iPhone, etc. But yeah, even just the fact they don’t force all of their websites use Windows screenshots is saying a lot by itself.

Ha, yeah, I did consider getting my windows machine out for some the screenshots, then I could do light/dark win/mac. In the end, I figured the same framing was better because I mainly wanted to highlight the light/dark theming support, and "cross-OS" isn't really a feature you need to show for a website

I'm fascinated by the oscillation between straight corners and rounded corners every so often. One is popular for a while, then the trend goes the other way, and back again.

I have this theory that it's because of the "A/B-ification" of all web development. Our brains like novelty, and so when we see a different shape from what was there yesterday we instinctively prefer it, and so the A/B test dutifully reports that the new one performs better. And then two years later the same test tells you that people prefer the old shape, which is now new again.

The pendulum swing of the cool thing becoming lame and the old thing becoming cool describes all sorts of human trends.

Being a human endeavor, it always existed in web design as well. There was no -ification. Even the themes of early PHP software oscillated like this.

> Our brains like novelty, and so when we see a different shape from what was there yesterday we instinctively prefer it

How do you reconcile this with people complaining about redesigns? I tend to hate them, personally.

To me, the most infuriating trend in web design is adding a crazy amount of padding to everything and increasing the font size! The old TS website packed a ton of information into a single screen, but it seems like I need to scroll quite a bit in the redesign before I see the same amount of information.

Zooming out to 75% improves the experience, but honestly I feel like I'm going crazy!

Not sure why Microsoft shies away from offering compilation to MSIL. Maybe they don't want C# competition, but having TypeScript not require Node.js/Deno would actually be a good thing. Away from the transpilation part, it is shaping to be a great programming language!

It's a good question ( I have a YouTube video on some of the reasonings, https://www.youtube.com/watch?v=8qm49TyMUPI ) but the TLDR is that TS really wants to only be a type layer above JS - turning into something like MSIL means breaking JS runtime semantics or re-creating that in MSIL ourselves. The idea has been tried a little differently by MS research though, https://www.microsoft.com/en-us/research/publication/static-...

a great improvement in my opinion! typescript has grown on me tremendously over the years (coming from a long-time coffeescript advocate, which has been out of fashion and out of date for a long time, typescript while orthogonal has filled that niche).

i see their release timeline visualization is just divs with width hard coded in css.

Sigh, I had assumed they would implement a programmatic visualization that's bound to actual release data.

It is bound to actual release data!

https://github.com/microsoft/TypeScript-Website/blob/v2/pack...

The divs are updated every time the website is re-deployed, and it deploys often. This means we don't need to run JS to give you the right date info.

thanks for the info and that link to the source.

Edit: Isn't this where the 55%, 28%, 17% widths derived from? Looks like a hard coded values?

https://github.com/microsoft/TypeScript-Website/blob/d4c638f...

Ah, yeah that's what you mean - so the first time I built this graph I used the real dates and their difference from release to give accurate %s. This turned out to not work, because there wasn't enough space to fit the text underneath. I then explored making the graph vertical with accurate %s, but it still felt heavily one-sided at end with the beta/rc/release. all clumped at the bottom.

The third iteration is this, I moved the release date up into a sentence above, then had a mostly representational but kinda accurate overview of the three release stages. I think it gets the idea of the phases across, works in all browser sizes etc and doesn't take up too much visual space

Is there a link to download the documentation because I missed it?

Right at the end of the first sentence of the article.

I totally missed it on mobile.

For the handbook specifically (the part where we expect you to read from start to finish) I created both an epub and pdf in the publishing process, you can see the links here: https://www.typescriptlang.org/docs

The PDF one isn't stunning, bit of a WIP, but the epub one is good.

What kind of stack have they used to create the new site?

"The main website for TypeScript, a Gatsby website which is statically deployed" https://github.com/microsoft/TypeScript-Website

I gave a write-up on my motivations for choosing Gatsby on their blog too: https://www.gatsbyjs.org/blog/2020-01-23-why-typescript-chos...

Oh Microsoft marketing.

“The new version of the website was built out of a desire to make the documentation for TypeScript feel as expansive as its type-system, ”

I don’t know if I would call it “expansive”. I’d call it modern, powerful, efficient.

I say this thinking that most web developers view type systems as constraining, the opposite of expansive.

By picking on such an inconsequential bullet point, it almost seems like you picked the first thing that you could use, no matter how tenuous, to trojan-horse in the age-old dynamic- vs static-typing debate. ;)

It’s the classic war of eternity.

But seriously, marketing is about using the exact right words, and this seemed sloppy.

Still, excited about the new site.

BTW: ironically I’m in the middle of porting a Node/React project to Typescript and wishing fervently that I had started before I created so much crappy code to convert.

Reply on news.ycombinator.com