V8 - partly coded in JS..
...that's compiled to C(++) with Python!!?!?!?
That was my big finding. So now i have V8 JS code running in my V8 in my browser. How's that for metaprogramming?
More when I get my modified REPL working...
trying on a metaphor

roma★
Stranger Things
will byers stan first human second
tumblr dot com
DEAR READER
Monterey Bay Aquarium

if i look back, i am lost

Origami Around
sheepfilms
I'd rather be in outer space 🛸

oozey mess

JVL
taylor price
almost home

祝日 / Permanent Vacation

tannertan36

shark vs the universe
Misplaced Lens Cap
Mike Driver
seen from United Kingdom

seen from United States
seen from United States
seen from United States

seen from Netherlands

seen from Malaysia

seen from France

seen from Malaysia

seen from T1

seen from China
seen from United States
seen from United States

seen from United States

seen from Canada
seen from China

seen from Türkiye

seen from Malaysia

seen from United States
seen from United States
seen from United States
@code-cook-play-sleep
V8 - partly coded in JS..
...that's compiled to C(++) with Python!!?!?!?
That was my big finding. So now i have V8 JS code running in my V8 in my browser. How's that for metaprogramming?
More when I get my modified REPL working...
Accessing HTML canvas directly
Hacker school, week 5 gone. Time goes by quickly...
So I played with canvas a bit, making my own mandelbrot fractal zoomer. For drawing the whole screen, I find it nicer to have a direct access to the "bitmap" that gets drawn, especially when you will need to iterate through each pixel on your "screen".
This means you have a big array, which need 4 bytes (in JS case, 4 places) for each pixel, for the R, G, B and Alfa-components.
In canvas, you can access it like this:
var canvasEl = document.getElementById("screen"), context = canvasEl.getContext("2d"), width = canvasEl.width, height = canvasEl.height, imageData = context.createImageData(width, height); var setPixel = function(x, y, r, g, b, a) { var index = (x + y * imageData.width) * 4; imageData.data[index ] = r; imageData.data[index + 1] = g; imageData.data[index + 2] = b; imageData.data[index + 3] = a; } var getPixel = function(x, y) { var index = (x + y * imageData.width) * 4, pixel = {}; pixel.r = imageData.data[index ]; pixel.g = imageData.data[index + 1]; pixel.b = imageData.data[index + 2]; pixel.a = imageData.data[index + 3]; }
Mode details here http://beej.us/blog/data/html5s-canvas-2-pixel/
Closures and scope
Hacker school Week 4.
This week I've done
my first realish python application, with tests
reading up on scoping, how compilers handle it etc programming language theory
checking data science lectures
made a twitter sentiment analyser in python for the data science course, played around with that (dalai lama is more popular than pizza, which is more popular than kittens)
looked at Eric's NES emulator - cool stuff!
I feel I've been focusing on many things, but picking up understanding about useful things so I'm not too worried.
What I learned from the theory?
closure = function + its environment (or execution context)
So when you create a closure, you create a binding between a function and its environment, which contains state (variable values etc).
dynamic scope -created at runtime. scope gets extended to functions called inside a scope
lexical scope - created from source, before runtime. scope gets extended to functions defined inside a scope
eg.
var y = 1;
var c = function() { console.log(y); }
var b = function() { var y = 2; c(); }
b();
c();
Returns in lexical (static) scope
1
1
and in dynamic scope
1
2
Other thing was that although lexical/dynamic scope and block/function/module-scope sound like they're related, I find it way easier to think of them separately.
- Dynamic / static scope defines how scope gets managed.
- Expression/Block/Function scope tells you how big the scope is, but doesn't affect the "depth".
Day 12 in hackerSchool
I started this yesterday, after seeing Mary Rose-Cook's presentation "spaceInvaders in 30 minutes". So I made very barebones asteroids on JS
It's not great, but it has the basic mechanics in place. I feel fixing the problems now (improving collision detection, throttling shooting, solving accidental collisions in setup, keeping score, ...) would take 1-2 days more time, and I don't know how much I'd learn from that. So I think I'll leave this project at this for the moment, and maybe continue it sometime later.
This was fun, got some contact to canvas and started to remember some 2d geometry again. Might be inspired to try out some 3d stuff after 10+ years.
Learning A* for puzzle solving
Thursday I finished a visualisation for a 8-puzzle solver.
8 puzzle?
8-puzzle is this game most people have probably played, where you have 8 pieces in a 3x3 square, leaving one slot empty. The numbers are in randomish order, and the purpose is to order them to an increasing order.
For the solution (following instructions in the coursera Algorithms I programming exercise), I used A* algorithm. A* seems to be usually used as a path-finding algorithm
By board, I mean any situation after a move. By neighbour I mean a board, that's 1 move away from a board.
A priority queue is a semi-sorted data structure, where you can insert data, and get the "highest priority" at a very low cost. It's practical in the way that you can insert multiple new rows and always get easily the current "top" row. My implementation used a binary heap.
The solver
The solver works by taking the initial puzzle, figuring out its the neighbouring boards, which means 2-4 boards (depending on where the empty slot is), of which every time except on the first move, one is a board that we have already had.
If I were using depth first or breadth first search, we would just iterate through all possible combinations until we find a solution, or all the possible solutions.
What is different with A* is that is uses heuristics to choose the next board to evaluate, trying to predict which moves seem to lead closer to the solution, thus reducing the number of boards that are actually created or evaluated.
Heuristics
The heuristic consists of 2 parts
The cost of getting to current board g(n)
A heuristic giving some kind of measure of estimated cost to getting to solution. h(n)
This gives us a way to give priority to each board, which helps the algorithm to separate paths that look promising from those that don't. Total priority is f(n) = g(n) + h(n)
Where
- h(n) is practically "how many moves did it take to get to current board"
- g(n) is manhattan distance (in ideal world, how many moves at a minimum you need to do to each block to get to solution)
The main loop
The main process looks something like this in
Get most promising board (highest priority) from the priority queue.
Else check if current board is the goal
If not, get its neighbours, their priorities and push them into the priority queue
If the priority queue is not empty, loop
else there's no solution.
That's it
To me one of the big understandings was that this simple algorithm used for path finding can actually be used for simple artificial intelligence, and much beyond just route-finding (most A* examples I've found seem to be about finding routes on square game boards). Other surprise was how this algorithm means much fewer combinations need to be tested than with algorithms that guarantee a shortest path (like Dijkstra's algorithm).
If you got interested in A*, or didn't understand it from my explanation, this seems to be a very good source on A*. http://theory.stanford.edu/~amitp/GameProgramming/AStarComparison.html
Two days at HackerSchool
This summer I'm doing Hacker School in NY for 3 months.
I've tried to focus on basic algorithms, and have done implementations for JS of a dequeue, priority queue and a binary search tree. (can be found at github It's very useful and I feel I'm gaining a better gut feel on what could be used where, and why "good" implementations might not require much more work that brute force ones, if one is just familiar enough with the classical algorithms and data structures and knows how to map problems to them.
The distraction is i'm learning what other people are doing around me and am more and more impressed by what everybody's working on. It's great (and very very humbling) to feel I've got a lot to learn from everybody in here. The chat used here (Zulip) is full of interesting discussions, and I have to force myself to ignore it to get actual stuff done.
Today I'm trying to focus on expanding my priority queue into something more practical and making something useful with the binary search tree. Let's see what I'll actually end up doing.
Where do astronauts hang out?
Allowing less variation in characters as password length increases. Refreshingly sane password-policy. I was thinking of something similar the other day (just multiple validation regexps after initial condition like length condition ok)
About efficient and not very efficient learning strategies.
Union-find and graphs
Somehow I thought of union-find as a completely separate data structure from undirected graphs, and spent some time trying to figure out the difference.
It seems it's just a way to solve some (just undirected, I think) graph related problems, like checking if two sites (seems equal to vertex) are connected, not necessarily adjacently.
A crossword puzzle game using regular expressions. Earn achievements completing puzzle challenges. Easy tutorials for people new to regular expressions.
This is surprisingly addictive...
Javascript Allongé
JS lovers and haters, I recommend reading Javascript Allongé . I found it very informative, clearly written and inspiring. It feels like a functional-programming oriented, warmer and more brain-teasing than "Javascript - the good parts" but there's some similar feeling also. "JS the good parts" is more like a reference, "JS Allongé" is more like a literary piece elaborating the issues and bringing more detail.
You can read it online (for free currently), or buy the eBook.
https://leanpub.com/javascript-allonge/
I learned for ex. how to build functions like bind, curry, memoize, how exactly variable encapsulation works with closures. Basically it gave me the tools to write my little underscore-ish library Malabi. It's simple (and not very tested or fast), but now I feel confident I understand and could write the tools in underscore. Most of all, I got a whole lot better understanding of how to apply some functional programming ideas to JS, and got interested more in stuff like combinatory logic (can't say I understand it all that well yet though but am planning to read "To mock a mockingbird" one of these days to improve my understanding).
The author, Reginald Braithwaite has a lot of interesting articles/posts, JS/coffeescript libraries etc interesting stuff on his site.
"Thou shalt not code on an empty belly!"
Dijkstra's 2 stack algorithm
It's awesome. For the first time, an expression evaluation logic for simple compilers that seems easy to understand.
http://en.wikipedia.org/wiki/Shunting-yard_algorithm
Veggie tempura
You'll need for the batter
1 cup tempura flour (or 100g)
160ml cold water (can use sparkling I hear)
The tempura flour package has instructions, so follow them. These are for the flour I used. Mix the batter with water, leave lumpy. If you over-mix it, it'll become too hard/sticky. Keep the batter cold, I put my bowl in another one with cold water.
For veggies I used
1/2 medium sweet potato, cut into pinkie size sticks
1 carrot, sliced to finger length sticks
1/2 green pepper, sliced
1/2 aubergine, sliced to finger size sticks
You need oil, preferably one with a high smoke point. I used peanut oil. Fill a small pot, so that you can fit 5-10 veggies at a time in it. Oil should be between 170-180C, you should be able to test this with a bit of the batter. If it sinks of floats it's too hot or cold. It should swim (like a tempura mermaid).
Dip veggies in batter just before dropping them in the oil. They should cook between 1-3min, depending on the veggie. 3min was ok for the sweet potato, aubergine maybe 1-2min. Tongs work well for picking them from the pot.
Meat balls in tomato sauce
Meat balls:
2 garlic cloves
1 medium onion
1/2 dried chili
350g ground organic beef
frozen parsley (3-4 tbsp)
1dl panko
5-6 tbsp milk
salt
pepper
olive oil for frying onions etc
Tomato sauce
1 banana shallot
2 garlic cloves
1/2 tsp shrug (any spicy paste should do fine)
400g (1 can) crushed tomatoes
3-4 tbsp grated parmesan
oregano
a little sugar
salt
pepper
(some leftover tomato sauce used for pizza)
more olive oil for frying
- Chop garlic, onion and dried chili. Fry until fragrant and translucent. Put aside.
- in small bowl mix panko with milk. Mix in another bowl meat, parsely and seasonings, onion and panko/milk. Form meatballs the size of a golf ball.
- Fry the meat balls a bit (in the olive oil), add shallots, garlic and chili paste. In a couple of minutes add the tomatoes, parmesan, oregano, sugar, salt, pepper (aka "the rest of the stuff")
- Cook for a while on medium heat, then simmer for 15-20 minutes, or until meatballs are cooked.
Banana bread
Some banana bread in the morning, while the wife was sleeping.
Recipe from here:
http://www.anediblemosaic.com/?p=11220
But I cut some corners, because didn't have all the ingredients.
what I used
2 cups flour
3/4 tbs baking soda
1/2 tsp salt
1/2 tsp cinnamon
----------- (dry above, wet below)
3/4 cup brown sugar
1/4 cup caster sugar
1/4 cup butter
1/3 cup greek yoghurt
2 eggs
3 bananas, mashed
2 tsp vanilla extract
Heat oven to 175C, mix wet stuff & sugar in one bowl, dry stuff in another bowl. Combine & mix a little (not much, dough should be lumpy).
Butter loaf pan (mine was about 20cm x 10cm), put dough in, bake for 1h (until fork inserted doesn't stick). Cool on a rack for 10min before taking bread out of the loaf, and let cool for a bit before eating.
Banana bread gets better after in 1-2 days.
Oh, the previous one I made was a bit better. This wasn't bad either.