Demystifying TypeScript Decorators

on YouTube ↗32m

" summary

Shows how TypeScript 1.5 implements the ES2016 decorator proposal by transpiling decorators to plain ES5/ES6 using Object.defineProperty and Object.getOwnPropertyDescriptor, so browsers need no native support. Builds real decorators—log, perf and memoize—in Visual Studio Code, wraps original methods via descriptor.value, measures a slow call at ~1001ms and a cached second call at ~0ms, and composes class/property/method decorators successfully.

AI-written summary · about

" chapters (11)

1. 0:00Introduction and welcome
2. 0:26What are TypeScript decorators
3. 3:16Browser support and transpilation
4. 9:17Setting up the demo project
5. 12:49Adding logging manually
6. 14:38Creating the log decorator
7. 23:07Decorators at class and property level
8. 24:59Performance measurement decorator
9. 26:01Memoization decorator
10. 27:26Real-world decorator libraries
11. 30:15Caution and future outlook

" related talks

• 48mFalling in love with decorators ES6/TypeScriptDaniel Ostrovsky · JS Fest 2019 Autumn
• 17mWrapping it up with DecoratorsNicole Oliver · ng-conf 2019
• 46mTypeScript Decorators - Higher Order Functions in DisguiseDamjan Vujnovic · NDC Oslo 2018
• 16mDiscover the power of decorators in TypeScriptMaarten Tibau · ngVikings 2019
• 40mStandardizing JavaScript Decorators in TC39Daniel Ehrenberg · Full Stack Fest 2019
• 27mAdvanced TypeScript: elegant solutions to common problemsStefano Mostarda · jsDay 2017
• 46mDecorating JavaScriptSergio Arbeo · Codemotion Madrid 2016
• 21mTypescript meta programming from 0 to 100Daniel Ostrovsky · ng-conf 2022