Today we’re happy to announce the availability of our release candidate (RC) of TypeScript 3.5. Our hope is to collect feedback and early issues to ensure our final release is simple to pick up and use right away.<\/p>\n
To get started using the RC, you can get it through NuGet<\/a>, or use npm with the following command:<\/p>\n You can also get editor support by<\/p>\n Let’s explore what’s new in 3.5!<\/p>\n TypeScript 3.5 introduces several optimizations around type-checking and incremental builds.<\/p>\n Much of the expressivity of our type system comes with a cost – any more work that we expect the compiler to do translates to longer compile times. Unfortunately, as part of a bug fix in TypeScript 3.4 we accidentally introduced a regression that could lead to an explosion in how much work the type-checker did, and in turn, type-checking time. The most-impacted set of users were those using the styled-components library. This regression was serious not just because it led to much higher build times for TypeScript code, but because editor operations for both TypeScript and JavaScript users became unbearably slow.<\/p>\n Over this past release, we focused heavily on optimizing certain code paths and stripping down certain functionality to the point where TypeScript 3.5 is actually faster<\/em> than TypeScript 3.3 for many incremental checks. Not only have compile times fallen compared to 3.4, but code completion and any other editor operations should be much snappier too.<\/p>\n If you haven’t upgraded to TypeScript 3.4 due to these regressions, we would value your feedback to see whether TypeScript 3.5 addresses your performance concerns!<\/p>\n TypeScript 3.4 introduced a new TypeScript 3.5 includes several optimizations to caching how the state of the world was calculated – compiler settings, why files were looked up, where files were found, etc. In scenarios involving hundreds of projects using TypeScript’s project references in For more details, you can see the pull requests to<\/p>\n Much of the time, we want to create an object that omits certain properties. It turns out that we can express types like that using TypeScript’s built-in Here we “subtracted” It turns out this type of operation comes up frequently enough that users will write a helper type to do exactly this:<\/p>\n Instead of making everyone define their own version of For more details, see the pull request on GitHub to add TypeScript has a feature called excess property checking<\/em> in object literals. This feature is meant to detect typos for when a type isn’t expecting a specific property.<\/p>\n In TypeScript 3.4 and earlier, certain excess properties were allowed in situations where they really shouldn’t have been. For instance, TypeScript 3.4 permitted the incorrect Previously, a non-disciminated union wouldn’t have any<\/em> excess property checking done on its members, and as a result, the incorrectly typed In TypeScript 3.5, the type-checker at least verifies that all the provided properties belong to some<\/em> union member and have the appropriate type, meaning that the sample above correctly issues an error.<\/p>\n Note that partial overlap is still permitted as long as the property types are valid.<\/p>\n In TypeScript 3.5, you can now reference UMD global declarations like<\/p>\n from anywhere – even modules – using the new This feature might require some background if you’re not familiar with UMD globals in TypeScript. A while back, JavaScript libraries were often published as global variables with properties tacked on – you sort of hoped that nobody picked a library name that was identical to yours. Over time, authors of modern JavaScript libraries started publishing using module systems to prevent some of these issues. While module systems alleviated certain classes of issues, they did leave users who were used to using global variables out in the rain.<\/p>\n As a work-around, many libraries are authored in a way that define a global object if a module loader isn’t available at runtime. This is typically leveraged when users target a module format called “UMD”, and as such, TypeScript has a way to describe this pattern which we’ve called “UMD global namespaces”:<\/p>\n Whenever you’re in a script file (a non-module file), you’ll be able to access one of these UMD globals.<\/p>\n So what’s the problem? Well, not all libraries conditionally<\/em> set their global declarations. Some just always<\/em> create a global in addition to registering with the module system. We decided to err on the more conservative side, and many of us felt that if a library could<\/em> be imported, that was probably the the intent of the author.<\/p>\n In reality, we received a lot of feedback that users were writing modules where some libraries were consumed as globals, and others were consumed through imports. So in the interest of making those users’ lives easier, we’ve introduced the npm install -g typescript@rc<\/pre>\n<\/div>\n
\n
\n
Omit<\/code> helper type<\/a><\/li>\n--allowUmdGlobalAccess<\/code> flag<\/a><\/li>\nSpeed improvements<\/h2>\n
Type-checking speed-ups<\/h3>\n
--incremental<\/code> improvements<\/h3>\n--incremental<\/code> compiler option. This option saves a bunch of information to a .tsbuildinfo<\/code> file that can be used to speed up subsequent calls to tsc<\/code>.<\/p>\n--build<\/code> mode, we’ve found that the amount of time rebuilding can be reduced by as much as 68% compared to TypeScript 3.4<\/a>!<\/p>\n\n
tsconfig.json<\/code><\/a><\/li>\n<\/ul>\nThe
Omit<\/code> helper type<\/h2>\nPick<\/code> and Exclude<\/code> helpers. For example, if we wanted to define a Person<\/code> that has no location<\/code> property, we could write the following:<\/p>\ntype<\/span> Person<\/span> =<\/span> {\r\n name:<\/span> string<\/span>;\r\n age:<\/span> number<\/span>;\r\n location:<\/span> string<\/span>;\r\n};\r\n\r\ntype<\/span> RemainingKeys<\/span> =<\/span> Exclude<\/span><keyof<\/span> Person<\/span>, \"<\/span>location\"<\/span><\/span>>;\r\n\r\ntype<\/span> QuantumPerson<\/span> =<\/span> Pick<\/span><Person<\/span>, RemainingKeys<\/span>>;\r\n\r\n\/\/ equivalent to<\/span>\r\ntype<\/span> QuantumPerson<\/span> =<\/span> {\r\n name:<\/span> string<\/span>;\r\n age:<\/span> number<\/span>;\r\n};<\/pre>\n<\/div>\n\"location\"<\/code> from the set of properties of Person<\/code> using the Exclude<\/code> helper type. We then picked them right off of Person<\/code> using the Pick<\/code> helper type.<\/p>\ntype<\/span> Omit<\/span><T<\/span>, K<\/span> extends<\/span> keyof<\/span> any<\/span>> =<\/span> Pick<\/span><T<\/span>, Exclude<\/span><keyof<\/span> T<\/span>, K<\/span>>>;<\/pre>\n<\/div>\nOmit<\/code>, TypeScript 3.5 will include its own in lib.d.ts<\/code> which can be used anywhere. The compiler itself will use this Omit<\/code> type to express types created through object rest destructuring declarations on generics.<\/p>\nOmit<\/code><\/a>, as well as the change to use Omit<\/code> for object rest<\/a>.<\/p>\nImproved excess property checks in union types<\/h3>\n
type<\/span> Style<\/span> =<\/span> {\r\n alignment:<\/span> string<\/span>,\r\n color?<\/span>:<\/span> string<\/span>\r\n};\r\n\r\nconst<\/span> s:<\/span> Style<\/span> =<\/span> {\r\n alignment: \"<\/span>center\"<\/span><\/span>,\r\n colour: \"<\/span>grey\"<\/span><\/span>\r\n\/\/ ^^^^^^ error! <\/span>\r\n};<\/pre>\n<\/div>\nname<\/code> property in the object literal even though its types don’t match between Point<\/code> and Label<\/code>.<\/p>\ntype<\/span> Point<\/span> =<\/span> {\r\n x:<\/span> number<\/span>;\r\n y:<\/span> number<\/span>;\r\n};\r\n\r\ntype<\/span> Label<\/span> =<\/span> {\r\n name:<\/span> string<\/span>;\r\n};\r\n\r\nconst<\/span> thing:<\/span> Point<\/span> |<\/span> Label<\/span> =<\/span> {\r\n x: 0<\/span>,\r\n y: 0<\/span>,\r\n name: true<\/span> \/\/ uh-oh!<\/span>\r\n};<\/pre>\n<\/div>\nname<\/code> property slipped by.<\/p>\nconst<\/span> pl:<\/span> Point<\/span> |<\/span> Label<\/span> =<\/span> {\r\n x: 0<\/span>,\r\n y: 0<\/span>,\r\n name: \"<\/span>origin\"<\/span><\/span> \/\/ okay<\/span>\r\n};<\/pre>\n<\/div>\nThe
--allowUmdGlobalAccess<\/code> flag<\/h2>\nexport as namespace foo;\r\n<\/code><\/pre>\n--allowUmdGlobalAccess<\/code> flag.<\/p>\nexport<\/span> as<\/span> namespace<\/span> preact<\/span>;<\/pre>\n<\/div>\nallowUmdGlobalAccess<\/code> flag in TypeScript 3.5.<\/p>\n