|| (logical OR) will use the right value when the left side is [[falsy]]. ?? (nullish coalescing) only uses the right value when the left side is nullish, i.e. null or undefined.

// ||
console.log('' || 'default') // 'default'
console.log('test' || 'default') // 'test'

console.log(0 || 'default') // 'default'
console.log(12 || 'default') // 12

console.log(false || 'default') // 'default'
console.log(true || 'default') // true

console.log(undefined || 'default') // 'default'
console.log(null || 'default') // 'default'

// ??
console.log('' ?? 'default') // ''
console.log('test' ?? 'default') // 'test'

console.log(0 ?? 'default') // 0
console.log(12 ?? 'default') // 12

console.log(false ?? 'default') // false
console.log(true ?? 'default') // true

console.log(undefined ?? 'default') // 'default'
console.log(null ?? 'default') // 'default'