Mingc mingc00

In-Application Sandboxing with Web Workers

A design rationale.

For the past fews years, the Web has been shifting control to the client. Given the limitations of remote services, developers are now looking for ways to "unhost" static applications – that is, break the dependency on remote servers while still using the Web platform.

One untapped technology for client-side control is the Web Worker Sandbox. This API lets the Page load, execute, and destroy separate Worker threads which use their own Virtual Machines. By using Worker Sandboxes to drive behavior, the Web can give users the choice of which software they run together, shifting development from a centralized SaaS model into a distributed and free (as in freedom) script-sharing model.

Worker Sandboxes can Execute Arbitrary Code

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.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

Just some notes and references for myself.

In bash, you can access your C:\ drive via /mnt/c/
~ = C:\Users\MLM\AppData\Local\lxss\home\mlm and is different from your Windows user directory C:\Users\MLM

	# 適用於【鼠鬚管】0.9.13+
	# 位置：~/Library/Rime/squirrel.custom.yaml
	# 用法：想要哪項生效，就刪去該行行首的#字符，但注意保留用於縮進的空格

	patch:
	# us_keyboard_layout: true # 鍵盤選項：應用美式鍵盤佈局
	# show_notifications_when: growl_is_running # 狀態通知，默認裝有Growl時顯示，也可設爲全開（always）全關（never）
	# style/horizontal: true # 候選窗横向顯示
	# style/inline_preedit: false # 非內嵌編碼行
	# style/font_face: "儷黑 Pro" # 我喜歡的字體名稱

	var parser = document.createElement('a');
	parser.href = "http://example.com:3000/pathname/?search=test#hash";

	parser.protocol; // => "http:"
	parser.hostname; // => "example.com"
	parser.port; // => "3000"
	parser.pathname; // => "/pathname/"
	parser.search; // => "?search=test"
	parser.hash; // => "#hash"
	parser.host; // => "example.com:3000"

	class GAEHandler(logging.Handler):
	"""
	Logging handler for GAE DataStore
	"""
	def emit(self, record):

	from google.appengine.ext import db

	class Log(db.Model):
	name = db.StringProperty()

	<!DOCTYPE html>
	<html>

	<head>
	<script src="background.js"></script>
	</head>

	<body>
	<textarea id="sandbox"></textarea>
	</body>

Mingc mingc00

In-Application Sandboxing with Web Workers

What forces layout / reflow

Element APIs

Getting box metrics

How to google things