Msirkovsky

// On the server side:

function ServerComponent(){
return <div>I am a server component</div>
}

<ClientComponent>
<ServerComponent></ServerComponent>
</ClientComponent>

Msirkovsky

<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
  <ContentTemplate>
    <asp:Calendar ID="Calendar1" ShowTitle="True" OnSelectionChanged="Calendar1_SelectionChanged"
      runat="server" />
    <div> Background: <br />
      <asp:DropDownList ID="ColorList" AutoPostBack="True" OnSelectedIndexChanged="DropDownSelection_Change"
        runat="server">
        <asp:ListItem Selected="True" Value="White"> White </asp:ListItem>
        <asp:ListItem Value="Silver"> Silver </asp:ListItem>

Msirkovsky

const [lat, long] =  getCoordinates()
vs.
const [long, lat] =  getCoordinates()

//How do you know which one is correct? Even typescript doesn't help you here.

// Better version with a record:
const {lat,long} =  getCoordinates()

Msirkovsky

const memoized = new Map()

function compute(... args) {
  const key = #[...args] // magic is here
  if (memoized.has(key)) 
  { 
    return memoized.get(key)
  }
  else {
    const value = carrySlowComputation(...args)

Msirkovsky

const memoized = new Map()

function compute(... args) {
  const key = JSON.stringify({...args})
  if (memoized.has(key)) 
  { 
    return memoized.get(key)
  }
  else {
    const value = carrySlowComputation(...args)

Msirkovsky

// [count, setCount] is a classic tuple but now without the support of a native tuple.
const [count, setCount] = useState(0)

Msirkovsky

const record = #{ name: "S. Holmes",  age: 27 }
const record2 = Record.fromEntries([["age", 27], #["name", "S. Holmes"]]) // Note that any iterable of entries will work

const tuple = Tuple(...[1, 2, 3])
const tuple2 = Tuple.from([1, 2, 3]) // Note that an iterable will work as well

record == #{ name: "S. Holmes",  age: 27 } => true
tuple == #[1, 2, 3]) => true

// JS Compiler throws an error when using a non-primitive value

Msirkovsky

const friends1 = #["G. Lestrade"]
friends2 = friends1.pushed("Dr. Watson")
// tup1 == #["G. Lestrade"]
// tup2 == #["G. Lestrade", "Dr. Watson"]

const tup3 = #["G. Lestrade", "Dr. Watson"]
const tup4 = tup2.sorted 
// tup3 == #["G. Lestrade", "Dr. Watson"]
// tup4 == #["Dr. Watson", "G. Lestrade"]

Msirkovsky

const user = #{ name: "S. Holmes",  age: 27 }

// with immutable types, you are restricted to changing value directly:
user.age = 28 // throws error 

// but, this works:
const userOneYearOlder = #{ ...user, age: 28} // =>  #{ name: "S. Holmes",  age: 28 }
// It also means:
user == userOneYearOlder // => false

Msirkovsky

const primitive = "string is an immutable primitive"
const primitive2 = primitive + " - change it"
primitive  !== primitive2 

const obj1 = { value: 1}
const obj2 = obj1
obj2.value = 2 // change
obj1 === obj2 // => true

// Restricted use: