Posts tagged javascript

Medium Medium | Javascript
image from Medium
The headline is a little alarmist, but this is a great explanation of some bitcoin scam code that someone placed into a popular node package. I agree that building businesses on top of volunteers is not sustainable and I hope the Node community can work on a solution. Reusing community code is a fast way to develop but you trade away some security.

Amazon Feed Generator Update: Categories

The Amazon Feed Generator is still humming away on my server. Now with categories!

Say you want to stay up with the latest cat calendars that Amazon offers. It was kind of a pain before. Now you can select Books then the Calendar category within books and that specificity makes all the difference! You'll find things like the Cats in Art 2018 Wall Calendar before anyone else.

image: cats_in_art_2018

I'm not sure who these people are buying 2018 cat calendars already but I guess it doesn't hurt to be prepared.

Related, node.js is still neat.

Pinboard Popular Tweets

I use the bookmarking service Pinboard and I'm a fan of its Popular Bookmarks page. A lot of interesting stuff surfaces there. However, the page isn't exactly information rich. Here's a screenshot of the page this morning:

image: pinboard_embed_tweets1

I circled all the instances where the popular link title is simply Twitter. I wanted to be able to know what those links were without visiting Twitter so I whipped up a little Greasemonkey (aka Tampermonkey in Chrome) script to embed the tweets in the page. The script is on Github here: pinpoptweets.js. (I'll leave installation as a fun exercise for you, reader.)

Now when I visit that page I see many, many embedded tweets:

image: pinboard_embed_tweets1

onfocus is AMPed

I have officially jumped on the Accelerated Mobile Pages bandwagon. Every post page here at onfocus now has an AMP version. (You can append /amp to any post URL to see it in action. This post, AMPed. I'll wait here.)

Pretty similar, eh? I thought it would be good to get a sense of how AMP pages are different from standard HTML. There are some proprietary tags and some required JavaScript dependencies. I guess if you're loading a dozen JS libraries and a million lines of CSS, going through the AMP conversion process could help get you thinking about minimalism. Not much to change here. I could probably combine a couple JavaScript files into one.

In 2003 I added WAP cards to this site. Those are long gone. Maybe AMP is the new future.

Update from the future: Hello from 2019. At some point I removed AMP from my site because I think it's a walled garden that doesn't necessarily improve performance—especially for a small site like this. AMP gives Google more control in a world where they have enough.


(Depending on what browsers you need to support.) This is a nice resource that includes some pure CSS methods for features you'd typically build with JavaScript.

Resizing Images with Node.js

My fun with Node.js continues. Yesterday I put together a script to resize jpegs on-the-fly: imageSize.

As part of my c2bk program I've been revisiting this site and cleaning up pieces that have broken over the years. One of those pieces is a few dozen galleries of photos I posted here between 1999-2005. Before photo-sharing sites existed you had to do it yourself. The photos are small and not very good, but they are part of my history.

I added thumbnails for each gallery to my archive page. The images are small, but they're not thumbnail-sized which made that archive page inefficient to load. Picking those images out one by one and creating thumbnails seemed like a hassle. Even writing a script to do it seemed like it wasn't worth the time involved.

Then I thought, what if I could just specify the image size in the URL and have them automatically be the correct size? That sounded like a job for node.js and CloudFront. Resizing the image was quick work with sharp. It took a bit to get the URL path-parsing working correctly and to add some caching headers to the response, but then it was all set.

By putting this behind CloudFront, the images are generated on-demand when needed but should be served from Amazon's servers most of the time. Might be overkill for some thumbnails on my archive page, but it's a handy thing to have in my toolbox for future blog/photography experimentation.

Scraping Together RSS with Node.js

The other day I was sitting around thinking about scraping a website (as one does) and I was frustrated by the complicated regex I was going to have to write to pick the data I wanted out of HTML. (Your classic two-problems problem.) So I started daydreaming about being able to scrape sites using jQuery selectors to get the elements I needed.

Then I thought, how about using a pure JavaScript environment like Node.js? I like servers and I like JavaScript, so it seems like I should like Node.js just fine. With a bit of searching I came across a great tutorial: Scraping the Web with Node.js and I was off and scraping. The cheerio module had already solved my jQuery selection problem.

At this point I could easily grab the data, but I was frustrated thinking about wrangling it into a consumable format. I was starting to get in the Node.js mindset and thought, "I bet there's a module that can help with this." A few minutes of searching later, node-rss was installed.

It took a bit of wrangling to get my first RSS feed going, but I was surprised at how quickly it all came together. It's not so different from firing up cpan and including modules in Perl scripts. But npm is just friendlier. Being able to run npm install in a new environment takes some the tedium out of your day.

So yeah, the Node.js script I wrote goes out and fetches Likes (favs, stars, hearts, etc.) from Medium, Twitter, GitHub, and Hacker News and returns RSS feeds with those likes. This lets me bring all of my favorites from those places into one spot where I can then do other things with them, hooray! I put the code up on GitHub: Recommended RSS.

Then with the help of forever I set it up as a service and I'm aggregating away. My to-do list for this little app includes caching and handling dates. I wonder if there are modules for those.

False Depth, JavaScript, and Surrealism

I didn't want an iPhone 7. I mean, I don't want one. The improvements are incremental at best. And that fake depth of field!? That's gimmicky, right? You can't simulate beautiful bokeh. You need heavy glass. Then I read this take: iPhone 7 Plus Depth Effect is Legit. Hmph.

Ah, front end JavaScript frameworks. Let your heart soar as you read how they've been rated in The State of JavaScript 2016. Then cry tears of knowing sorrow as you read How it feels to learn Javascript in 2016.

Speaking of surrealism, Salvador Dalí keeps appearing in my news. Taschen is republishing Dalí's 1973 cookbook. A cookbook? What's next? Finding out he had a long lost collaboration with Walt Disney at some point in 1945? And that it has been reconstructed for viewing on our personal screens? Yes:

And and?! He illustrated a version of Alice in Wonderland? Yes. Or is it all Mirage?
  • "A jQuery plugin for creating big, bold & responsive headlines." This page is a nice demo. Resize your browser to see the headlines at various sizes.
« Older posts