justinwoo

Reposted from Qiita

For almost a year now, I've been using this "flux" architecture to organize my React applications and to work on other people's projects, and its popularity has grown quite a lot, to the point where it shows up on job listings for React and a lot of people get confused about what it is.

Why I'm tired of using and teaching flux

There are a billion explainations on the internet, so I'll skip explaining the parts. Instead, let's cut to the chase -- the main parts I hate about flux are the Dispatcher and the Store's own updating mechanism.

If you use a setup similar to the examples in facebook/flux, and you use flux.Dispatcher, you probably have this kind of flow:

isaacs

# Hello, and welcome to makefile basics.
#
# You will learn why `make` is so great, and why, despite its "weird" syntax,
# it is actually a highly expressive, efficient, and powerful way to build
# programs.
#
# Once you're done here, go to
# http://www.gnu.org/software/make/manual/make.html
# to learn SOOOO much more.

jcoglan

// This is in response to https://gist.github.com/Peeja/5284697.
// Peeja wanted to know how to convert some callback-based code to functional
// style using promises.

var Promise = require('rsvp').Promise;

var ids = [1,2,3,4,5,6];

// If this were synchronous, we'd simply write:

spadgos

<snippet>
  <content><![CDATA[
${1:return }${2:ParentClass}.prototype.${3:method}.apply(this, arguments);
$0
]]></content>
  <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
  <tabTrigger>super</tabTrigger>
  <!-- Optional: Set a scope to limit where the snippet will trigger -->
  <scope>source.js</scope>
</snippet>

nzakas

• http://tutsplus.com/tutorial/writing-modular-javascript/
• https://github.com/aranm/scalable-javascript-architecture
• https://github.com/patrick99e99/scalable-js-architecture-app
• http://scaleapp.org/
• http://addyosmani.com/largescalejavascript/
• https://github.com/tcorral/Hydra.js/
• http://alanlindsay.me/kerneljs/
• http://terrifically.org/
• https://github.com/gorillatron/cerebral

eirikbacker

//addEventListener polyfill 1.0 / Eirik Backer / MIT Licence
(function(win, doc){
	if(win.addEventListener)return;		//No need to polyfill

	function docHijack(p){var old = doc[p];doc[p] = function(v){return addListen(old(v))}}
	function addEvent(on, fn, self){
		return (self = this).attachEvent('on' + on, function(e){
			var e = e || win.event;
			e.preventDefault  = e.preventDefault  || function(){e.returnValue = false}
			e.stopPropagation = e.stopPropagation || function(){e.cancelBubble = true}

privman

// WARNING: untested

// Override the default View.extend to automatically parse the events object upon class definition.
Backbone.View.originalExtend = Backbone.View.extend;
Backbone.View.extend = function (protoProps, classProps) {
    var downEvent = "touchup" in window ? "touchup" : "click";
    if (typeof(protoProps.events) === "object") {
        // Replace the word "down" in the events hash with platform-specific event type 
        _.each(protoProps.events, function replaceDown(triggerString, functionName, events) {
            var newTriggerStr = triggerStr.replace(/^down /, downEvent + ' ');

gryzzly

var down = "touchup" in window ? "touchup" : "click";

var abstractView = Backbone.View.extend({
    // we don't want both click and touch handlers
    // delegated on touch-enabled devices
    events: function () {
        "click .toggler" : "foo", 
        "touchup .toggler" : "bar"
    },
    initialize: function () {

phoboslab

// rAF polyfill based on https://gist.github.com/1579671

(function(w) { 
	"use strict";
	
	// Find vendor prefix, if any
	var vendors = ['ms', 'moz', 'webkit', 'o'];
	for( var i = 0; i < vendors.length && !w.requestAnimationFrame; i++ ) {
		w.requestAnimationFrame = w[vendors[i]+'RequestAnimationFrame'];
	}

padolsey

function methodIsDefined(fn, obj) {
  var ns = fn.split('.');
  fn = ns.pop();
  do {
    if (!ns[0]) {
      return typeof obj[fn] === 'function';
    }
  } while(obj = obj[ns.shift()]);
  return false;
}