Dependent Types for JavaScript Ravi Chugh Ranjit Jhala Dave Herman Pat Rondon Panos Vekris UCSD Mozilla Google UCSD

DependentTypes for JavaScript

Ravi ChughRanjit JhalaDave HermanPat RondonPanos Vekris

UCSDUCSDMozillaGoogleUCSD


“Dynamic” Features Facilitate Rapid Innovation

1. Better Development Tools

2. Better Reliability

3. Better Performance

var person = { name : { first : “John”, last : “McCarthy” }};

person.nom;

person.nom.first;

… but this raises TypeError3

produces undefined rather than error…

var person = { name : { first : “John”, last : “McCarthy” }};

person.nom;

person.nom.first;

4

if (unlikely()) {

}

some errors hard to catch with testing


Will Never Replace Need forTesting and Dynamic Checking

But Want Static Checking When Possible

6

JavaScript

implicit global object

scope manipulation

var lifting

‘,,,’ == new Array(4)

7

JavaScript

implicit global object

scope manipulation

var lifting

‘,,,’ == new Array(4)

objects prototypes

lambdastype-tests

“The Good Parts” arrays

eval()

8

JavaScript

“The Good Parts”

Dependent JavaScript

Use Logic, butAvoid Quantifiers!

9Expressiveness

“Usability”

F* + Dijkstra

TypedJS

Nik@9:00am

Shriram@2:30pm

Me@now

Dependent JavaScript (DJS)[POPL ’12, OOPSLA ’12]

10

Me@now


= Refinement Types+ Several New Quantifier-Free Mechanisms

DJS

11

typeof true // “boolean”

typeof 0.1 // “number”typeof 0 // “number”

typeof {} // “object”typeof [] // “object”typeof null // “object”

12

typeof returns run-time “tags”

Tags are very coarse-grained types

“undefined”

“boolean”

“string”

“number”

“object”

“function”

13

Refinement Types{x|p}

“set of values x s.t. formula p is true”

{n|tag(n) = “number” }Num

{v|tag(v) = “number” ∨ tag(v) = “boolean” }NumOrBool

{i|tag(i) = “number” integer(i) }Int

{x|true }Any

14

{n|tag(n) = “number” }Num

{v|tag(v) = “number” ∨ tag(v) = “boolean” }NumOrBool

{i|tag(i) = “number” integer(i) }Int

{x|true }Any

Refinement Types

Syntactic Sugarfor Common Types

Refinement Types

15

3 :: {n|n = 3}

{n|n > 0} 3 ::{n|tag(n) = “number” integer(n)} 3 ::{n|tag(n) = “number”} 3 ::

Refinement Types

16

{n|n = 3}

{n|n > 0} {n|tag(n) = “number” integer(n)} {n|tag(n) = “number” }

<:<:<:<:

Subtyping is Implication

Refinement Types

17

{n|n = 3}

{n|n > 0} {n|tag(n) = “number” integer(n)} {n|tag(n) = “number” }

Subtyping is Implication

18

ArraysPrototypesMutable ObjectsDuck TypingTag-Tests

19

Tag-Tests ArraysPrototypesMutable ObjectsDuck Typing

var negate = function(x) {

if (typeof x == “boolean”)

return !x;

else

return 0 - x;

}

negate( )

!true

true

// false

20




return !x;

else

return 0 - x;

}

negate( )

0 - 2 // -2

2

21




return !x;

else

return 0 - x;

}

negate( )

0 - [] // 0?!?

[]

22




return !x;

else

return 0 - x;

} Use types to prevent implicit coercion

(-) :: (Num,Num) Num

23




return !x;

else

return 0 - x;

}

Function type annotation inside

comments

//: negate :: (x:Any) Any

24




return !x;

else

return 0 - x;

}


so negationis well-typed

x is boolean...

DJS is Path Sensitive

✓

25




return !x;

else

return 0 - x;

}


x is arbitrarynon-boolean value…so DJS signals error!

✗

DJS is Path Sensitive

✗

26




return !x;

else

return 0 - x;

}

//: negate :: (x:NumOrBool) Any

✓

27




return !x;

else

return 0 - x;

}

//: negate :: (x:NumOrBool) Any

this time,x is a number…✓so subtractionis well-typed

28




return !x;

else

return 0 - x;

}

//: negate :: (x:NumOrBool) Any✓

but returntype is imprecise

29


//: negate :: (x:NumOrBool) NumOrBool



return !x;

else

return 0 - x;

}

✓

30


/*: negate :: (x:NumOrBool) {y|tag(y) = tag(x)} */



return !x;

else

return 0 - x;

}

✓

output type depends on input value

31

Duck Typing ArraysPrototypesMutable ObjectsTag-Tests

if (duck.quack)

return “Duck says ” + duck.quack();

else

return “This duck can’t quack!”;

What is “Duck Typing”?

32


if (duck.quack)


else



(+) :: (Num,Num) Num

(+) :: (Str,Str) Str

33


if (duck.quack)


else



Can dynamically testthe presence of a method

but not its type

34


if (duck.quack)


else


{d|tag(d) = “object”∧

{v|has(d,“quack”)

{v| sel(d,“quack”) :: UnitStr }

Operators from McCarthy theory of arrays

35


if (duck.quack)


else


{d|tag(d) = “object”∧

{v|has(d,“quack”)

{v| sel(d,“quack”) :: Unit Str }

Call produces Str, so concat well-typed

✓

36

Mutable Objects ArraysPrototypesTag-Tests Duck Typing

var x = {};

x.f = 7;

x.f + 2;

x0:Empty

x1:{d|d = upd(x0,“f”,7)}

DJS is Flow Sensitive

McCarthy operatorDJS verifies that x.f is definitely a number

37

Mutable Objects ArraysPrototypesTag-Tests Duck Typing

var x = {};

x.f = 7;

x.f + 2;

x0:Empty

x1:{d|d = upd(x0,“f”,7)}

DJS is Flow Sensitive

Strong updates to singleton objects

Weak updates to collections of objects

38

ArraysPrototypesTag-Tests Duck Typing Mutable Objects

39


Typical“Dynamic”Features

40


Typical“Dynamic”Features

JavaScript

41

Prototypes ArraysTag-Tests Mutable ObjectsDuck Typing

child

parent

...

grandpa

null

Upon construction, each object links to a

prototype object

42


If child contains k, then Read k from child

Else if parent contains k, then Read k from parent

Else if grandpa contains k, then Read k from grandpa

Else if …

Else Return undefined

child

parent

...

grandpa

null

var k = “first”; child[k];Semantics of Key Lookup

...

43


child

parent

grandpa

null

H(Rest of Heap)





Else if …


{v|if has(child,k) then

{v|ifv=sel(child,k)

...

44


child

parent

grandpa

null

H(Rest of Heap)





Else if …



{v|ifv=sel(child,k)

{v|else if has(parent,k) then

{v|ifv=sel(parent,k)




Else if …


...

45



{v|ifv=sel(child,k)



child

parent

grandpa ???

null

H(Rest of Heap)


...

46



{v|ifv=sel(child,k)



{v|else

{v|ifv=HeapSel(H,grandpa,k)) }

child

parent

grandpa ???

null

H(Rest of Heap)


Abstract predicateto summarize theunknown portion

of the prototype chain

...

47



{v|ifv=sel(child,k)



{v|else


{ “first” : “John” }child

parent{ “first” : “Ida”, “last” : “McCarthy” }

grandpa ???

null

H(Rest of Heap)

<:

{v|v=“John”}

var k = “first”; child[k];

...

48



{v|ifv=sel(child,k)



{v|else


{ “first” : “John” }child

parent{ “first” : “Ida”, “last” : “McCarthy” }

grandpa ???

null

H(Rest of Heap)

var k = “last”; child[k];

<:

{v|v=“McCarthy”}

49


Key Idea:

Reduce prototypesemantics to decidable

theory of arrays

Prototype Chain Unrolling

50

ArraysTag-Tests PrototypesMutable ObjectsDuck Typing

var nums = [0,1,2];while (…) { nums[nums.length] = 17;}

A finite tuple…

… extended to unbounded collection

51


var nums = [0,1,2];while (…) { nums[nums.length] = 17;}

delete nums[1];

for (i = 0; i < nums.length; i++) { sum += nums[i];}

A “hole” in the array

Missing element within “length”

52


Track types, “packedness,” and lengthof arrays where possible

{a |a :: Arr(T)

{a | packed(a)

{a | len(a) = 10}

X T T T T… X ……

T? T? T? T? T?… T? ……

T? { x | T(x) x = undefined }

-1 0 1 2 len(a)

X { x | x = undefined }

53


{a |a :: Arr(Any)

{a | packed(a) len(a) = 2

{a | Int(sel(a,0))

{a | Str(sel(a,1))}

Encode tuples as arrays

var tup = [17, “cacti”];

54


var tup = [17, “cacti”];

tup[tup.length] = true;

{a |a :: Arr(Any)

{a | packed(a) len(a) = 3

{a | …}

55


DJS handles other array quirks:

Special length property

Array.prototypeNon-integer keys

56

Tag-Tests PrototypesMutable ObjectsDuck Typing Arrays

57

What About eval?

Arbitrary code loading

…

eval(“…”);

…

Old Types

58

What About eval?…

eval(“…”);

//: #assume

…

Old Types

New TypesNew Types

Can Integrate DJS with“Contract Checking” at Run-time

aka “Gradual Typing”

59


Expressiveness

“Usability”

F* + Dijkstra

= Refinement Types+ Nested Refinements+ Flow Sensitive Types+ Prototype Unrolling+ Array Encoding

DJS

Quantifier-Free Mechanisms}

60

Function Subtyping…{d|sel(d,“f”) :: }

(x:Any) { y|y = x }{d|sel(d,“f”) :: }(x:Num) Num<:

61

Function Subtyping…

{d|sel(d,“f”) :: }(x:Num) Num

{d|sel(d,“f”) :: } (x:Any) { y|y = x }

62


{d|sel(d,“”)f :: }(x:Num) Num

{d|sel(d,“ ”f :: } (x:Any) { y|y = x }

… With Quantifiers∀x,y. true ∧ y = f(x) y = x

∀x,y. Num(x) ∧ y = f(x) Num(y)✓Valid, but First-Order Logic is Undecidable

63


{d|sel(d,“”)f :: }(x:Num) Num

{d|sel(d,“ ”f :: } (x:Any) { y|y = x }

… Without Quantifiers!Nested Refinements

Treat Function Types as Uninterpreted

Implication = SMT Validity + Syntactic Subtyping

64

Heap Updates…

… With Quantifiers

var x = {};

x.f = 7;h1

h2

h0

∧ …

∧ sel(h1,x) = empty∧ ∀y. x ≠ y sel(h1,y) = sel(h0,y)

∧ sel(h2,x) = upd(sel(h1,x),“f”,7)∧ ∀y. x ≠ y sel(h2,y) = sel(h1,y)

Encode Heap w/ McCarthy Operators

65

Heap Updates…

x:T1/H1 T2/H2

output typeinput heap

input type output heap

Flow-Sensitive Types (à la Alias Types)

var x = {};

x.f = 7;h1

h2

h0

… Without Quantifiers!

66

Prototype Inheritance…

… Without Quantifiers!

Array Semantics…

67


Expressiveness

“Usability”

F* + Dijkstra

= Refinement Types+ Nested Refinements+ Flow Sensitive Types+ Prototype Unrolling+ Array Encoding

DJS

Quantifier-Free Mechanisms}

DesugaredProgram

DJSProgram

DesugarerBased on Guha et al.

[ECOOP ’10]

JavaScript λ-Calculus + References + Prototypes

Implementation

DesugaredProgram

Z3 SMTSolver

TypeChecker

DJSProgram

DesugarerBased on Guha et al.

[ECOOP ’10]

ImplementationProgrammer Chooses

Warnings or Errors

Local Type Inference

Subtyping w/o Z3 If Possible

70

306a

408(+33%)

LOCbefore/after

13 Excerpts from: JavaScript, Good Parts SunSpider Benchmark Suite Google Closure Library

Benchmarks

Chosen to Stretch the Current Limits of DJS

71

306a

408(+33%)

LOCbefore/after


Benchmarks

9 Browser Extensions from: [Guha et al. Oakland ’11]

321a

383(+19%)

1,003a

1,027(+2%)

2 Examples from: Google Gadgets

1,630

1,818(+12%)

TOTALS

72

1,630

1,818(+12%)

TOTALS

Already Improved by SimpleType Inference and Syntactic Sugar

Plenty of Room for Improvement• Iterative Predicate Abstraction• Bootstrap from Run-Time Traces

1,818(+12%)

73

LOCbefore/after


306a

408(+33%)

Benchmarks

9 Browser Extensions from: [Guha et al. Oakland ’11]

321a

383(+19%)

2 Examples from: Google Gadgets

1,003a

1,027(+2%)

1,630

1,818(+12%)

10 sec

Running Time

3 sec

19 sec

32 sec

TOTALS

74

1,818(+12%)

32 sec

Already Improved by SimpleOptimizations• Avoid SMT Solver When Possible• Reduce Precision for Common Patterns

Plenty of Room for Improvement

1,630

TOTALS

32 sec





76Expressiveness

“Usability”

F* + Dijkstra

TypedJS


TypeScriptLightweight (unsound) static checking tools becoming popular

Opportunityto improveIDE tools

77

Reliability / Security• Refinement types for security in presence of

untrusted code (e.g. browser extensions)• Combine with static reasoning for JavaScript

Performance• JITs use static analysis + profiling to optimize

dynamic features (e.g. dictionaries, bignums)• Opportunity to enable more optimizations





DJS is a StepTowards

These Goals}

Thanks!

ravichugh.com/djs

Documents

Dependent Types for JavaScript Ravi Chugh Ranjit Jhala Dave Herman Pat Rondon Panos Vekris UCSD Mozilla Google UCSD