JavaScript tips

 I have been reading a good picture book, 'How the brain works', published by Dorling Kindersley. I realised it will be a long time before Artificial Intelligence (AI) replicates our amazing brains with just numbers. Our brains have evolved over millions of years and are specifically adapted for humans. Science does not fully understand how our brains work. Our feeling of consciousness is partly an illusion. I suppose AI will be a different kind of intelligence to ours. I found this picture book in my local library.

 I add short names for frequently used built-in functions, when 'minifying' my game. I use 'sed' to append code like this to the start of my game:     Array.prototype.p=Array.prototype.push     Math.f=Math.floor     document.ce=document.createElement     Node.prototype.ac = Node.prototype.appendChild     var w=window;w.st=w.setTimeout; I then change the code like this:     sed -e 's/\.push(/.p(/g'  But, I have not found a way of shortening the property 'Node.nextSibling'. Modifying the DOM may not work in old versions of Internet Explorer. I get annonyed when I see repeated code when I look through my game's code after I have 'minified' it

 I ran UglifyJS twice and got a small further reduction in size. I now set the 'passes' option of 'UglifyJS' to '3'. This further reduces the size of the JavaScript in my game by 0.5%. I do not get much reduction in size when I run the 'CSSO' minifier twice or run the HTML minifier at 'jsonformatter.org' twice. The 'terser' JavaScript minifier is much faster than 'UglifyJS' but produces slightly bigger results with the default options.

 I use Douglas Crockford's 'JSMin' minifier a lot. I modified it to keep newlines so I can look through the results. You can find it at:       ' https://github.com/Bert-Beckwith/myjsmin ' 'jsmin.c' is a small C program that removes JavaScript comments and excess whitespace. I often comment out old code rather than remove the code, so I use 'JSMin' to look at what is left. Afterwards I say ':g/^$/d' in 'vim' to remove blank lines. I really should just remove the old code and learn to use my source control system better. I also use 'JSMin' to minify my game, partly so that the input to 'UglifyJS' is smaller. I use an online version of 'UglifyJS' as my Linux system at home is a bit too old to run it. 'JSMin' is small and fast - I can run it in the background whilst playing my game.

 Breaking coding down into small steps can make coding boring. People sometimes say you should break down programming into small steps so as to 'keep it simple'. I have got into the habit of coding in very small steps because I am often tired in the evenings when I am coding. I spent several weeks adding an option to the settings page of my game.  Previously I might have done the whole thing in one evening. However, I work on around 7 or 8 improvements to my game at any one time. I use a very old browser at home where I have no connection to the Internet, so I need to visit my local library to test on modern browsers.  Also my game takes several minutes to load on my 25-year old Pentium computer.

 My game looked strange when I tested it on mobile phones run by 'appetize.io'. There was a thick border around the boards of players. And the game seemed to hang when I pressed a button. I thought maybe Chrome was adding an outline when an 'input' element got the focus. So I tried setting 'outline: 0'. This did not fix the problem. However, when I tested my game on mobile phones at 'browserstack.com' then everything looked fine. I realised that maybe there was a problem at 'appetize.io'. However, 'browserstack.com' only gives you one free minute per device.  Whereas 'appetize.io' gives you 30 free minutes a month. 'appetize.io' worked fine for tablets. This was a few months ago. Now my game looks fine on mobiles run by 'appetize.io'.