)
}
}
)
(
}
{
)
)
(
)
(
(
{
}
)
(
)
}
)
)
{
(
(
)
)
}
)
(
}

Building Spikes Codegolf

  1. f = 
  2.  
  3. n=>`   ^ 
  4.   /|\\
  5.  /.|.\\
  6. /..|..\\
  7. ___`.replace(/.[_|^]./g,'$&'.repeat(n))+'____'
  8.  
  9. // test it out
  10. document.body.innerHTML += 
  11. `<pre>${f(1)}
  12. ${f(3)}
  13. ${f(4)}`

Great codegolf stackexchange answer from user tsh

Odd Gradient Notation

  1. // "Being clever is not clever"
  2. // -- Bjarne Stroustrup
  3. D = document
  4. ang = {
  5.   '|': 180,
  6.   '-': 90,
  7.   '\\': 135,
  8.   '/': 225
  9. }
  10.  
  11. box = def => {
  12.   def = def.split(/\s+/)
  13.   form = def.length
  14.   I = i => parseInt(def[i], 16)
  15.  
  16.   ;[,,, _=>{x = y = I(0); w = h = I(1); c = def[2]},
  17.     _=>{x = I(0), y = I(1); w = h = I(2);c = def[3]},
  18.     _=>{x = I(0); y = I(1); w = I(2); h = I(3); c = def[4]}
  19.   ][form]()
  20.  
  21.   c = c.split``
  22.  
  23.   ca = c[0]
  24.   ca = ca+ca+ca
  25.   cD = ang[c[1]]
  26.   cb = c[2]
  27.   cb = cb+cb+cb 
  28.  
  29.   D.body.appendChild(
  30.     D.createElement`div`
  31.   ).style = `
  32.     position: absolute; left: ${x}px; top: ${y}px;
  33.     width: ${w}px; height: ${h}px;
  34.     background: linear-gradient(${cD}deg, #${ca}, #${cb})
  35.   `
  36. }
  37.  
  38. const parse = prog => prog.trim()
  39.   .split(/\n+/m)
  40.   .map(line => box(line.trim()))
  41.  
  42. parse(`
  43.   0 64 0/f
  44.   64 64 0\\f
  45.   a0 f0 30 54 f\\0
  46.   0 6f 20 60 0-c
  47.   f 7f 20 60 0|c
  48.   1f 8f 30 30 c/0
  49. `)

Just playing around… odd micro-gradient notation:

  1. '0 64 0/f'
  2. // x=0 y=0 width=0x64 height=0x64
  3. // 0/f = gradient black to white top right to bottom left
  4.  
  5. '64 64 0\\f'
  6. // x=0 y=0 width=0x64 height=0x64
  7. // 0\\f = black to to white gradient top left to bottom right
  8.  
  9. '0 6f 20 60 0-c'
  10. // x=0 y=0x6f width=0x20 height=0x60
  11. // 0-c = gradient black to grey (#ccc) left to right
  12.  
  13. // etc... ( | ) is top to bottom grad
// css // dom // golfed // graphics // hacks // humor // regex // speed-coded

Martin Kleppe’s Golfed Blobs Quine

  1. <pre id=p style=background:#000><svg onload='setInterval(f=n=>
  2. {for(t++,o=i=1;i++<476;o+=i%30?([(f+"")[i%195],"o"][c=0|(h=v=>
  3. (M=Math).hypot(i/30-8+3*M.sin(t/8/v),i%30/2-7+4*M.cos(t/9/v)))
  4. (7)*h(9)*h(6)/52]||".").fontcolor(c?c>2:n):"\n");p.innerHTML=o},t=1)'>

Great golfed snippet from Martin Kleppe – can’t wait to fork it… 😀

This was updated a bit later to be even smaller:

  1. <body onload='setInterval(f=n=>{for(t++,o=i=1;i++<476;o+=i%30?([(f+f)[i],"o"][c=0|(h=v=>(M=Math).hypot(i/30-7+3*M.sin(t/8/v),i%30/2-7+4*M.cos(t/9/v)))(7)*h(9)*h(6)/52]||".").fontcolor(c?c>2:n):"\n");p.innerHTML=o},t=1)'bgcolor=X><pre id=p>
// dom // golfed // graphics // hacks // html // humor // javascript // math // strings // tricks

Remove from String

  1. x='hello'
  2. x.replace(/h/g,'') // 17 bytes
  3. x.split`h`.join`` // 16 bytes
  4. x.replaceAll('h','') // 19 bytes

Another fun one from the great javascript golfing tips stackexchange thread.

This one comes from user emanresu-a and this answer.

Slider Range Input Wave

  1. N = 8 // try changing this
  2. b = document.body
  3.  
  4. b.innerHTML += 'Drag any slider<br>'
  5. for (i = N; i--;) 
  6.   b.innerHTML += `<input id=${i} value=0 type=range style=width:200px;display:block>`
  7.  
  8. onchange = oninput = e => {
  9.   t = e.target
  10.   for (i = N; i--;) 
  11.     t.id != i && (
  12.       self[i].value = 100 * Math.sin(t.value / 60 * i))
  13. }

Sine wave with range sliders…

snippet.zone ~ 2021-23 /// {s/z}