Xah Web Dev Blog Archive 2019-01

JavaScript String Problem

ECMAScript 2016, 2017, 2018, 2019 new. still incomplete.

JavaScript requestAnimationFrame sucks

calls the function f when browser is ready to update display.

f is passed a integer ms of type DOMHighResTimeStamp. It is milliseconds from performance.timing.navigationStart.

new Date(performance.timing.navigationStart + ms)

should be equal to

new Date()

let x = performance.now();
let y = performance.timing.navigationStart + x;
let z = new Date();

console.log( new Date(y) )
console.log( z  )

The purpose of requestAnimationFrame is when animation done by JavaScript needs to be updated frequently (say, few times a second). Instead of using setInterval, one can use it in combination with requestAnimationFrame, so that the code runs only when browser updates the display.

Example usage:

const update_clock = ((timestamp) => {
    const dd = new Date(performance.timing.navigationStart + timestamp);
    sec_hand.setAttribute("transform", "rotate(" + (dd.getSeconds()*6 + (dd.getMilliseconds()*6/1000)).toString() +  ")");

setInterval( (() => { requestAnimationFrame(update_clock) }) , 1000/20);

SVG Clock

the JavaScript web requestAnimationFrame is nasty. Extremely complex semantics, yet, no loop construct, so that user either need to use recursion with complicated manual timing control, or need to use setInterval anyway.

Array.prototype.flat (new)

number faq

converted all call of Object.getPrototypeOf to Reflect.getPrototypeOf

js Reflect.getPrototypeOf 2019-04-17 7fvt8
js Reflect.getPrototypeOf 2019-04-17


parceljs, a new js tech. nodejs Ryan Dahl highly recommended. https://parceljs.org

spent 1 hour on the svg path ellipse. still haven't figured out how to use it to draw a quarter circle arc. extremely idiotic tech.

SVG Path: Elliptical Arc

HTML4 Frameset, Best Idea Killed by Google

it's a sad story that the html4 frameset is killed, by Google and web dev community beginning around 2005. it's the best idea. Today's html5 and JavaScript still cannot do anything close.

Java doc is still (and only one) using frameset https://docs.oracle.com/javase/7/docs/api/

the JavaScript spec, ECMA-262 ECMAScript® Language Specification (LOL™) is the worst lang spec i've read. It is INCOMPREHENSIBLE and UNNECESSARILY so. Also, originally i put links to it from my tutorial for my own convenience of writing tutorial. But nobody else read it.

programers posting bullshit to get followers

Eric Elliott 2019-03-17 Qmjj7
Eric Elliott 2019-03-17 https://twitter.com/_ericelliott/status/1107339574999687168

this guy, posts bullshit daily, for like at least 3 years. basically, it's a marketing strategy, posting drama things and soundbytes to get lots clicks by the masses who don't know stuff. that's at least part of the reason he got 40k followers.

JavaScript here's my intro to the topics he listed

Google Webfont Tutorial (minor update)

CSS: user-select

do you have a specific case situation where programer needs to know type coercion result?

i think when one saw a code location where type coercion is happening, you simply just change the code so it's explicit type conversion, unless it's trivial or well-known cases such as number to string.

type coercion results between types that doesn't make sense, are usually just arbitrary, depending on the lang desiner or what happens to be the case in the lang. especially lang with bad history like js.

old articles

  1. Google AdSense Ban on Ancient Asian Goddess Sculpture Page
  2. How to Start Google Chrome in a New Instance?
  3. Google Reader RIPS
  4. Google's Deceptive Ad: Google Puts Ad in Email Under Promotion Tab
  5. Google: DON'T BE EVIL vs DON'T DO EVIL
  6. Google Now Requires JavaScript AND Cookies?
  7. Google Sitemap.org Domain Typosquatting Scam
  8. Are Googlers the Minions of Google Marketing?
  9. Steve Jobs 3 Months Before He Died
  10. TV Has Arrived on The Web
  11. Industrial Tech: Twilio, SendGrid, Google Cloud Messaging, Apple Push Notification Service
  12. Adjust Your Google Ad Preferences, or Opt Out
  13. Amazon Closes CA Affiliate Program
  14. Tech Humor: Apache vs Node.js vs NGINX 📺
  15. What is the Difference Between Google's “following” a Blog vs Subscribe?
  16. Humor: CSS Experimental Pain, Window Blind
  17. Gmail State-Sponsored Attack Warning
  18. Google Do Evil
  19. Google Gmail Blocks Mozilla Thunderbird
  20. Google Evil
  21. Google's PageSpeed Insights Fails Its Own Site
  22. Google Search Dropped Traffic To XahLee.org
  23. SEO: Underscore vs Hyphen: How Google Webmaster Advices Hurt Quality Writers 📺
  24. Hacker News Traffic Effect
  25. Web Tech Gossip
  26. Internet Explorer Anime Girl
  27. Global Internet Usage Hour Pattern
  28. Web Advertisement in 2011: JavaScript Popups
  29. MegaUpload Crime Boss
  30. Monolithic Web Pages
  31. Opera Browser Can't Load Twitter CSS: OCSP Error
  32. Software Piracy, Open Source, Free Software, Copyright
  33. How Much Can You Make by Blogging? Google AdSense?
  34. Why I'm Removing Tech Blogger Celebrities and Googler on Google Plus
  35. Social Network Post Scoring Systems and Their Consequences
  36. My Personal Photos of Steve Jobs (1955 to 2011)
  37. Steve Yegge's Google Platforms Rant
  38. SOPA: Stop or Start Online Piracy Act?
  39. JavaScript DOM SVG font-size sucks
  40. Modern Tablet Computer Features
  41. Twitter Usage Map
  42. Web Hosting Compared: 2006-01
  43. What Your Google Plus Strategy Should Be?
  44. Wikipedia Morons
  45. On Wikipedia's Misinformation
  46. Women in Tech: Today's Google Plus Recommendation?

CSS: Reset, Default Values

the last breath of google plus

the last breath of google plus

google plus shutdown 2019-02-14 4h37m
google plus shutdown 2019-02-14
sicp chapter 1 p24s6-s294x212
Web Design: Problem of Header Linking to Table of Contents


while reviewing old article Web Design: Should Hyperlinks Have Underline? discovered, that time.com does not use https still. very strange.

new nav box

User Interface Design

windows10 dark theme 2019-02-09 k59bs-s306x204
Dark Theme User Interface Design

Firefox Chinese Serif Font Touches Top CSS Border

Firefox chinese serif font bug 5pzmn
Firefox chinese serif font bug 5pzmn

Stupid Firefox bug. When you have font-family:serif on chinese char, it touches the top css border. Does not happen in Google Chrome or Safari.

简体繁體字表 List of Simplified/Traditional Chinese Characters

Chinese Font

Google Greed, YouTube Related Video

YouTube Scamer Stealing Video

writing a math curve plotter in JavaScript, without any library, part 1.
writing a math curve plotter in JavaScript, without any library, part 2.
twitter usage map 2019-01-22 frf7s-s356x176
Twitter Usage Map

This is How Google will Collapse

great article. the title is a click bait, but the article has lots relevant info.

[This is How Google will Collapse By Daniel Colin James. At https://hackernoon.com/how-google-collapsed-b6ffa82198ee ]

CSS: Outline

twitter spam js teacher 2019-01-02 29391-s210x298
Twitter Spam, from “JavaScript teacher”