-1
\$\begingroup\$

The following code, made by me, is a dice roll generator in Javascript and HTML5. When you press the button, it shows a visual representation of the dice roll. I have decreased the byte count of it to 749 bytes from 1.4 kilobytes thus far, but do not know how to continue. Run the below code on jsfiddle to see what I mean.

HTML5:
<button onclick="R()">Click</button>
<canvas id="a"></canvas>
Javascript:
a=document.getElementById("a")
c=a.getContext("2d")
c.scale(9,9)
var m =[
[2,0,0,0,3],
[0,0,0,0,0],
[4,0,1,0,4],
[0,0,0,0,0],
[3,0,0,0,2]
]
function R(){
x=Math.floor(Math.random()*6+1)
m.forEach((row,y)=>{
row.forEach((value,z)=>{
if(value==0){
c.fillStyle="white"
c.fillRect(z,y,1,1)
}
if(value==1){
if(x==1||x==3||x==5){
c.fillStyle="black"
}else{
c.fillStyle="white"
}
c.fillRect(z,y,1,1)
}
if(value==2){
if(x>=4){
c.fillStyle="black"
}else{
c.fillStyle="white"
}
c.fillRect(z,y,1,1)
}
if(value==3){
if(x>=2){
c.fillStyle="black"
}else{
c.fillStyle="white"
}
c.fillRect(z,y,1,1)
}
if(value==4){
if(x==6){
c.fillStyle="black"
}else{
c.fillStyle="white"
}
c.fillRect(z,y,1,1)
}
})
})
}

My eventual goal is to get this code below 500 bytes, while looking somewhat the same to the user. How do I continue shortening the code? I want the code to stay in Javascript and HTML5.

New contributor
Trevor Mershon is a new contributor to this site. Take care in asking for clarification, commenting, and answering. Check out our Code of Conduct.
\$\endgroup\$
  • 3
    \$\begingroup\$ Hi, I edited this to include the tag that I think is most relevant here - tips. Please take a look at the tag info and at this related discussion to see how you could improve this post. As it stands, we are missing a bunch of information that we would need to be able to help with this. \$\endgroup\$ – FryAmTheEggman Nov 18 at 23:28
  • 2
    \$\begingroup\$ Does this answer your question? Tips for golfing in JavaScript \$\endgroup\$ – Xcali Nov 18 at 23:36
  • \$\begingroup\$ Convert your nested ifs to logical chains. Try to reduce repetition of c.FillStyle=blah. There are "minify" libraries around that you could look into. \$\endgroup\$ – roblogic Nov 19 at 0:32
  • 5
    \$\begingroup\$ Please be aware that code-golf is purely recreational and implies some very, very bad practices. If you're looking for shorter code as in "better and more efficient code", you should rather visit Code Review. Anyway, here is a quick attempt below 250 bytes with the same behavior. But I'm sure it can be golfed more aggressively. \$\endgroup\$ – Arnauld Nov 19 at 1:26
  • \$\begingroup\$ Just to add to what other comments have said (and to explain my close vote): tips questions are on-topic here, and browsing through the tag will demonstrate that. However, regardless of the "type" of question, we require questions to meet a certain standard of clarity, so that answerers have the best chance of providing helpful (for tips at least) answers. I would highly recommend editing in some context, along with some example executions, and I'd suggest explaining what golfs are/aren't acceptable. E.g. removing newlines would be a substantial golf, but that's not always OK elsewhere \$\endgroup\$ – caird coinheringaahing Nov 19 at 1:31