Posts

Responsive graphs with JavaScript and HTML

Image
 I could not get Chrome's Lighthouse tool to see my small responsive images. Also, if I toggled the device to be a mobile then Chrome did not load in the smaller images meant for a mobile. But if I simply shrunk the size of Chrome's pane which shows the page, then Chrome did load the responsive images. I think the reason is that the mobile that Chrome simulates has an image density greater than 'one'. So Chrome wants a large image that 'shrinks' down into the image density. I want to show the smaller images because the images are graphs and if a larger image is shrunk by the browser then the text becomes too small to read. I have redrawn most of my images specifically for smaller image sizes.  It is easy to redraw images made with Gnuplot, but harder to redraw 3D graphs made with Excel. I tried using a 'picture' tag rather than an 'img' tag. This is like 'art direction' where a completely different image is shown for different screen size...

Adding fetchpriority="high" to HTML

Image
 I have been adding 'fetchpriority="high"' to the HTML of images that are visible when the page is first shown. Chrome's 'Lighthouse' tool suggested this. But I show slightly different sets of images for mobiles and desktop computers.  If I set fetchpriority' in JavaScript then it may be too late.

How to remove a filename with strange characters on Linux

Image
 I learnt how to remove a filename with strange characters in its name. I say:     ls -li to get the inode number, and then delete the file with:       find . -type f -inum 155192 -exec rm {} \; I adapted this from an article on 'distrowatch.com' I tried to use the graphical file manager 'Midnight Commander' but I have mapped the function keys it uses to letters that do not work anymore on my keyboard. I can use 'Midnight Commander' outside of X Windows though. My old 'find' command does not support the '-delete' option.

JavaScript error that I dread

Image
 I dread getting the error, "Unexpected token ')'" from Chrome, at the last line of JavaScript in my game. Usually, there is an unclosed brace somewhere in the code. The last line of my game is the end of a self executing anonymous function enclosing the whole game: '})()'. Recently, I used 'rcsdiff' to see all the recent changes. Among the changes I had deleted the closing brace just above a change I had made. I use the RCS version control system. Another time, I commented out or deleted code until the error disappeared.
Image
 I often add blank lines around HTML that I am modifying to make things clearer.   Most times it does not make any difference. An HTML minifier will remove the blank lines.   I also often comment out old HTML code with '<!--' an '-->'

Technology news I read

Image
 When scraping names off Wikipedia I take breaks reading the technology news. Otherwise it is too boring. I read 'slashdot.org', 'osnews.com', 'distrowatch.com', 'lwn.net' and 'computerweekly.com' news and 'reuters.com/technology' news.

Formatting CSS

Image
 I have started putting braces on newlines in CSS. For example:     .c1,     .c2     {         color: blue;     } This makes adding another class at the end of the list a little easier. I suppose I could even write:       .c1     , .c2     {         color: blue;     } One project I worked on when I was younger formatted SQL like this:     SELECT a          , b       FROM t          , t2