Skip to content

Instantly share code, notes, and snippets.

@kkas
kkas / Structure.md
Created August 11, 2017 07:49 — forked from JeOam/Structure.md
Project Structure for Python (Tornado) Application

Project:

  • project/: A directory named with the project's name which stores the actual Python package
    • __init__py
    • app.py
    • settings.py
    • urls.py
    • models/
      • __init__.py
      • baes.py
  • handlers/
@kkas
kkas / Python_Tips.md
Last active February 25, 2016 04:18
Python Tips for myself

Python

Syntax and Grammer

Data Types

string

word = 'soccer'
@kkas
kkas / rAF.js
Created October 16, 2015 07:19 — forked from paulirish/rAF.js
requestAnimationFrame polyfill
// http://paulirish.com/2011/requestanimationframe-for-smart-animating/
// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating
// requestAnimationFrame polyfill by Erik Möller. fixes from Paul Irish and Tino Zijdel
// MIT license
(function() {
var lastTime = 0;
var vendors = ['ms', 'moz', 'webkit', 'o'];
@kkas
kkas / new_gist_file.md
Last active January 15, 2021 16:42
Browser Rendering Optimization Course Note (for myself)

Browser Rendering Optimization

Critical Rendering Path

Frames

  • If there's any kind of visual change onscreen, from scrolling to animations, the device is going to put up a new picture, or frame, onto the screen for the user to see.
  • Most devices today refresh their screen 60 times a second, which we measure in hertsz.
  • So to much that we need to have 60 frames to put up. Most of the time we'll refer to this as 60 frames a second, or fps.
  • People are expecially good at noticing when we miss one of these frames.
  • If the browser is taking too long to make a frame, it will get missed out. The frame rate will drop and users will see stuttering. If it is really bad, then the whole screen can lock up, which is the worst.

Milliseconds Per Frame

@kkas
kkas / new_gist_file.md
Last active October 6, 2015 07:27
HTML5 Canvas

HTML5 Canvas

DrawImage

<!DOCTYPE HTML>
<html>
  <head></head>
  <body>
 
@kkas
kkas / new_gist_file.md
Last active March 22, 2017 13:38
Object-Oriented JavaScript

Object-Oriented JavaScript

Scopes

Lexical Scope

  • the word describes the regions in your source code where you can refer to a variable by name without getting access errors.
  • Global scope:
    • if no functions are defined, every variable will be in this scope. **Every time you declare a function definition, a new lexical scope is created. **
    • it does not matter which file the source code are written in: they all share global scope.
@kkas
kkas / new_gist_file.md
Last active September 29, 2015 01:00
Useful websites for JS
@kkas
kkas / new_gist_file_0.md
Last active June 8, 2022 18:13
Website Performance Optimization (Note to myself)Some are taken from the online courses and some are taken from the links.

Website Performance Optimization

Why should I profile the site on my phone?

  • Mobile phones on the other hand are much more resource constrained: slower CPUs, less RAM and GPU memory, higher connection latencies, and so on. As a result, you should always try to profile and debug your site on mobile hardware to get a better and closer picture of how your users will experience your site on their handset.

Critical Rendering Path

https://developers.google.com/web/fundamentals/performance/critical-rendering-path/?hl=en

  • is the sequence of steps that the browsers go through to convert the HTML, CSS, and JavaScript into actual pixels on the screen.
  • if we can optimize this, then we can make our pages render fast, which makes for happier users.
@kkas
kkas / .vimrc
Created September 9, 2015 21:43
.vimrc
set nocompatible " be iMproved, required
filetype off " required
" set the runtime path to include Vundle and initialize
set rtp+=~/.vim/bundle/Vundle.vim
call vundle#begin()
" alternatively, pass a path where Vundle should install plugins
"call vundle#begin('~/some/path/here')
" let Vundle manage Vundle, required