Skip to content

Instantly share code, notes, and snippets.

View yyx990803's full-sized avatar

Evan You yyx990803

View GitHub Profile

Origin

Seed started out as a practice to create a data binding library that mimics Angular. While implementing it I also shaped the API to get rid of several things I don't like about Angular:

  • auto magic compile and no familar instantiating objects
  • have to be aware of how $digest loop works
  • doesn't play well with module build tools, e.g. component & browserify
  • bundles too much stuff (I just want data binding, something lightweight)

Personal preferences

// npm install gruntfile-yaml
// short version:
module.exports = require('gruntfile-yaml')
// or if you still need custom js:
module.exports = function (grunt) {
require('gruntfile-yaml')(grunt)
// do your own stuff...
}
@yyx990803
yyx990803 / starcounter.js
Last active March 24, 2024 05:25
Count your total stars!
var https = require('https'),
user = process.argv[2],
opts = parseOpts(process.argv.slice(3))
request('/users/' + user, function (res) {
if (!res.public_repos) {
console.log(res.message)
return
}
var pages = Math.ceil(res.public_repos / 100),
@yyx990803
yyx990803 / umd.js
Created January 27, 2014 16:40
umd
;(function(){
// module content
if (typeof exports == "object") {
module.exports = require("{{configName}}");
} else if (typeof define == "function" && define.amd) {
define(function(){ return require("{{configName}}"); });
} else {
this["{{standaloneName}}"] = require("{{configName}}");
@yyx990803
yyx990803 / problem.md
Last active August 29, 2015 13:57
Array diffing + DOM manipulation problem
  • We have two arrays of objects.
  • Each object has an associated DOM element, .el.
  • The two arrays are sharing some objects, but not all of them;
  • The two arrays have different orders for the shared objects.
  • The first array's associated DOM elements are already inserted in the DOM, reflecting the owner objects' order in the array.

Now we want to replace the first array with the second one, with the following requirements:

  • Update the DOM so that the inserted elements reflect the order of objects in the second array.
  • Reuse any existing objects and DOM elements.
@yyx990803
yyx990803 / dev.json
Last active August 29, 2015 14:02
dev script
"scripts": {
"dev": "watchify -e src/main.js -o js/build.js -v & stylus -w css/style.styl && fg"
}
<link rel="import" href="../core-icons/core-icons.html">
<link rel="import" href="../paper-icon-button/paper-icon-button.html">
<link rel="import" href="../paper-checkbox/paper-checkbox.html">
<link rel="import" href="../paper-ripple/paper-ripple.html">
<link rel="import" href="../paper-slider/paper-slider.html">
<link rel="import" href="../paper-tabs/paper-tabs.html">
<link rel="import" href="../paper-tabs/paper-tab.html">
<link rel="import" href="../paper-button/paper-button.html">
<link rel="import" href="../paper-radio-button/paper-radio-button.html">
<link rel="import" href="../core-drawer-panel/core-drawer-panel.html">
@yyx990803
yyx990803 / vue-element.html
Last active October 15, 2017 11:50
Vue custom element draft
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Vue.js custom element example</title>
<script src="../dist/vue.js"></script>
</head>
<body>
<my-element msg="custom message">original content</my-element>
<script>