Allan Lukwago epicallan

A series of reading lists mostly related to functional programming.

Stuff I wish I'd known sooner about service workers

I recently had several days of extremely frustrating experiences with service workers. Here are a few things I've since learned which would have made my life much easier but which isn't particularly obvious from most of the blog posts and videos I've seen.

I'll add to this list over time – suggested additions welcome in the comments or via twitter.com/rich_harris.

Use Canary for development instead of Chrome stable

Chrome 51 has some pretty wild behaviour related to console.log in service workers. Canary doesn't, and it has a load of really good service worker related stuff in devtools.

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Element

Box metrics

elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
elem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeight
elem.getClientRects(), elem.getBoundingClientRect()

##AutoComplete Scenario##

Capture user input to send to the service for data: http://jsfiddle.net/mattpodwysocki/uv5JU/
Throttle the data so we don't overload the server: http://jsfiddle.net/mattpodwysocki/EJqv5/
Ensure minimum number of characters: http://jsfiddle.net/mattpodwysocki/nWfH9/
Only distinct values, no repeats!: http://jsfiddle.net/mattpodwysocki/THMPk/

#RxJS 5 Operators By Example A complete list of RxJS 5 operators with easy to understand explanations and runnable examples.

Chinese Version by: @DrakeLeung

	{-# LANGUAGE InstanceSigs #-}

	import Control.Applicative
	import Control.Monad
	import Control.Monad.Trans.Writer
	-- Here is a direct style pythagoras function
	-- There are two noticeable things in the function body.
	-- 1. Evaluation order of x * x vs y * y is unknown/implicit.
	-- 2. We don't care what happens to the final value (implicit continuation).
	pyth :: (Floating a) => a -> a -> a

	timestamp :: String -> Q a -> Q a
	timestamp name action = do
	start <- runIO getCurrentTime
	runIO $ putStrLn $ "Starting " <> name <> ": " <> show start
	a <- action
	end <- runIO getCurrentTime
	runIO $ do
	putStrLn $ "Ending " <> name <> ": " <> show end
	putStrLn $ "Elapased " <> name <> ": " <> show (diffUTCTime end start)
	pure a

	<html>
	<body>
	<span id="output"></span>
	</body>
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
	<script src="main.js"></script>
	</html>

	SET @oldsite='http://oldsite.com';
	SET @newsite='http://newsite.com';
	UPDATE wp_options SET option_value = replace(option_value, @oldsite, @newsite) WHERE option_name = 'home' OR option_name = 'siteurl';
	UPDATE wp_posts SET post_content = replace(post_content, @oldsite, @newsite);
	UPDATE wp_links SET link_url = replace(link_url, @oldsite, @newsite);
	UPDATE wp_postmeta SET meta_value = replace(meta_value, @oldsite, @newsite);

	/* only uncomment next line if you want all your current posts to post to RSS again as new */
	#UPDATE wp_posts SET guid = replace(guid, @oldsite, @newsite);

	#!/usr/bin/perl

	#
	# @file
	# Converter tool, from Apache Common Log file to CSV.
	#
	# All code is released under the GNU General Public License.
	# See COPYRIGHT.txt and LICENSE.txt.
	#