From aa7ea0637ee16b5a238216a2e01a84f5eef3eb01 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Paul=20O=E2=80=99Shannessy?= <paul@oshannessy.com>
Date: Tue, 2 Jul 2013 13:08:24 -0700
Subject: [PATCH] New blog post

---
 blog/2013/06/02/jsfiddle-integration.html     |   2 +
 blog/2013/06/05/why-react.html                |   2 +
 blog/2013/06/12/community-roundup.html        |   2 +
 blog/2013/06/19/community-roundup-2.html      |   2 +
 blog/2013/06/21/react-v0-3-3.html             |   2 +
 blog/2013/06/27/community-roundup-3.html      |   2 +
 .../07/02/react-v0-4-autobind-by-default.html | 154 ++++++++++++++++++
 blog/index.html                               |  19 +++
 feed.xml                                      |  43 +++++
 9 files changed, 228 insertions(+)
 create mode 100644 blog/2013/07/02/react-v0-4-autobind-by-default.html

diff --git a/blog/2013/06/02/jsfiddle-integration.html b/blog/2013/06/02/jsfiddle-integration.html
index f51dcb3907..2e0f4cbf9a 100644
--- a/blog/2013/06/02/jsfiddle-integration.html
+++ b/blog/2013/06/02/jsfiddle-integration.html
@@ -57,6 +57,8 @@
     <h3>Recent posts</h3>
     <ul>
     
+      <li><a href="/react/blog/2013/07/02/react-v0-4-autobind-by-default.html">New in React v0.4: Autobind by Default</a></li>
+    
       <li><a href="/react/blog/2013/06/27/community-roundup-3.html">Community Round-up #3</a></li>
     
       <li><a href="/react/blog/2013/06/21/react-v0-3-3.html">React v0.3.3</a></li>
diff --git a/blog/2013/06/05/why-react.html b/blog/2013/06/05/why-react.html
index 03cf74f109..5edb79e7ec 100644
--- a/blog/2013/06/05/why-react.html
+++ b/blog/2013/06/05/why-react.html
@@ -57,6 +57,8 @@
     <h3>Recent posts</h3>
     <ul>
     
+      <li><a href="/react/blog/2013/07/02/react-v0-4-autobind-by-default.html">New in React v0.4: Autobind by Default</a></li>
+    
       <li><a href="/react/blog/2013/06/27/community-roundup-3.html">Community Round-up #3</a></li>
     
       <li><a href="/react/blog/2013/06/21/react-v0-3-3.html">React v0.3.3</a></li>
diff --git a/blog/2013/06/12/community-roundup.html b/blog/2013/06/12/community-roundup.html
index f778c9a75a..4f4807d001 100644
--- a/blog/2013/06/12/community-roundup.html
+++ b/blog/2013/06/12/community-roundup.html
@@ -57,6 +57,8 @@
     <h3>Recent posts</h3>
     <ul>
     
+      <li><a href="/react/blog/2013/07/02/react-v0-4-autobind-by-default.html">New in React v0.4: Autobind by Default</a></li>
+    
       <li><a href="/react/blog/2013/06/27/community-roundup-3.html">Community Round-up #3</a></li>
     
       <li><a href="/react/blog/2013/06/21/react-v0-3-3.html">React v0.3.3</a></li>
diff --git a/blog/2013/06/19/community-roundup-2.html b/blog/2013/06/19/community-roundup-2.html
index f6b0aa2227..cc398a6110 100644
--- a/blog/2013/06/19/community-roundup-2.html
+++ b/blog/2013/06/19/community-roundup-2.html
@@ -57,6 +57,8 @@
     <h3>Recent posts</h3>
     <ul>
     
+      <li><a href="/react/blog/2013/07/02/react-v0-4-autobind-by-default.html">New in React v0.4: Autobind by Default</a></li>
+    
       <li><a href="/react/blog/2013/06/27/community-roundup-3.html">Community Round-up #3</a></li>
     
       <li><a href="/react/blog/2013/06/21/react-v0-3-3.html">React v0.3.3</a></li>
diff --git a/blog/2013/06/21/react-v0-3-3.html b/blog/2013/06/21/react-v0-3-3.html
index f00459b984..220a86d672 100644
--- a/blog/2013/06/21/react-v0-3-3.html
+++ b/blog/2013/06/21/react-v0-3-3.html
@@ -57,6 +57,8 @@
     <h3>Recent posts</h3>
     <ul>
     
+      <li><a href="/react/blog/2013/07/02/react-v0-4-autobind-by-default.html">New in React v0.4: Autobind by Default</a></li>
+    
       <li><a href="/react/blog/2013/06/27/community-roundup-3.html">Community Round-up #3</a></li>
     
       <li><a href="/react/blog/2013/06/21/react-v0-3-3.html" class="active">React v0.3.3</a></li>
diff --git a/blog/2013/06/27/community-roundup-3.html b/blog/2013/06/27/community-roundup-3.html
index 8e38ec60aa..7d85575248 100644
--- a/blog/2013/06/27/community-roundup-3.html
+++ b/blog/2013/06/27/community-roundup-3.html
@@ -57,6 +57,8 @@
     <h3>Recent posts</h3>
     <ul>
     
+      <li><a href="/react/blog/2013/07/02/react-v0-4-autobind-by-default.html">New in React v0.4: Autobind by Default</a></li>
+    
       <li><a href="/react/blog/2013/06/27/community-roundup-3.html" class="active">Community Round-up #3</a></li>
     
       <li><a href="/react/blog/2013/06/21/react-v0-3-3.html">React v0.3.3</a></li>
diff --git a/blog/2013/07/02/react-v0-4-autobind-by-default.html b/blog/2013/07/02/react-v0-4-autobind-by-default.html
new file mode 100644
index 0000000000..2ede8ddf7b
--- /dev/null
+++ b/blog/2013/07/02/react-v0-4-autobind-by-default.html
@@ -0,0 +1,154 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+  <title>React | New in React v0.4: Autobind by Default</title>
+  <meta name="viewport" content="width=device-width">
+  <meta property="og:title" content="React | New in React v0.4: Autobind by Default" />
+  <meta property="og:type" content="website" />
+  <meta property="og:url" content="http://facebook.github.io/react/blog/2013/07/02/react-v0-4-autobind-by-default.html" />
+  <meta property="og:image" content="http://facebook.github.io/react/img/logo_og.png" />
+  <meta property="og:description" content="A JavaScript library for building user interfaces" />
+
+  <link rel="shortcut icon" href="/react/favicon.ico">
+  <link rel="alternate" type="application/rss+xml" title="React" href="http://facebook.github.io/react/feed.xml">
+
+  <link rel="stylesheet" href="/react/css/react.css">
+  <link rel="stylesheet" href="/react/css/syntax.css">
+  <link rel="stylesheet" href="/react/css/codemirror.css">
+
+  <script type="text/javascript" src="//use.typekit.net/vqa1hcx.js"></script>
+  <script type="text/javascript">try{Typekit.load();}catch(e){}</script>
+
+  <script type="text/javascript" src="/react/js/codemirror.js"></script>
+  <script type="text/javascript" src="/react/js/javascript.js"></script>
+  <script type="text/javascript" src="/react/js/react.min.js"></script>
+  <script type="text/javascript" src="/react/js/JSXTransformer.js"></script>
+  <script type="text/javascript" src="/react/js/live_editor.js"></script>
+  <script type="text/javascript" src="/react/js/showdown.js"></script>
+</head>
+<body>
+
+  <div class="container">
+
+    <div class="nav-main">
+      <div class="wrap">
+        <a class="nav-home" href="/react/index.html">
+          <img class="nav-logo" alt="" src="/react/img/logo_small.png" width="38" height="38">
+          React
+        </a>
+        <ul class="nav-site">
+          <li><a href="/react/docs/getting-started.html">docs</a></li>
+          <li><a href="/react/support.html">support</a></li>
+          <li><a href="/react/downloads.html">download</a></li>
+          <li><a href="/react/blog/" class="active">blog</a></li>
+          <li><a href="http://github.com/facebook/react">github</a>
+        </ul>
+        <!-- <iframe src="http://ghbtns.com/github&#45;btn.html?user=facebook&#38;repo=react.js&#38;type=fork"allowtransparency="true" frameborder="0" scrolling="0" width="62" height="20"></iframe> -->
+      </div>
+    </div>
+
+    
+
+    <section class="content wrap blogContent">
+  <div class="nav-docs">
+  <div class="nav-docs-section">
+    <h3>Recent posts</h3>
+    <ul>
+    
+      <li><a href="/react/blog/2013/07/02/react-v0-4-autobind-by-default.html" class="active">New in React v0.4: Autobind by Default</a></li>
+    
+      <li><a href="/react/blog/2013/06/27/community-roundup-3.html">Community Round-up #3</a></li>
+    
+      <li><a href="/react/blog/2013/06/21/react-v0-3-3.html">React v0.3.3</a></li>
+    
+      <li><a href="/react/blog/2013/06/19/community-roundup-2.html">Community Round-up #2</a></li>
+    
+      <li><a href="/react/blog/2013/06/12/community-roundup.html">Community Round-up #1</a></li>
+    
+      <li><a href="/react/blog/2013/06/05/why-react.html">Why did we build React?</a></li>
+    
+      <li><a href="/react/blog/2013/06/02/jsfiddle-integration.html">JSFiddle Integration</a></li>
+    
+    </ul>
+  </div>
+</div>
+
+  <div class="inner-content">
+    <h1>New in React v0.4: Autobind by Default</h1>
+    <p class="meta">July  2, 2013 by Paul O'Shannessy</p>
+
+    <hr>
+
+    <div class="post">
+      <p>React v0.4 is very close to completion. As we finish it off, we&#39;d like to share with you some of the major changes we&#39;ve made since v0.3. This is the first of several posts we&#39;ll be making over the next week.</p>
+
+<h2>What is React.autoBind?</h2>
+
+<p>If you take a look at most of our current examples, you&#39;ll see us using <code>React.autoBind</code> for event handlers. This is used in place of <code>Function.prototype.bind</code>. Remember that in JS, <a href="http://bonsaiden.github.io/JavaScript-Garden/#function.this">function calls are late-bound</a>. That means that if you simply pass a function around, the <code>this</code> used inside won&#39;t necessarily be the <code>this</code> you expect. <code>Function.prototype.bind</code> creates a new, properly bound, function so that when called, <code>this</code> is exactly what you expect it to be.</p>
+
+<p>Before we launched React, we would write this:</p>
+<div class="highlight"><pre><code class="js language-js" data-lang="js"><span class="nx">React</span><span class="p">.</span><span class="nx">createClass</span><span class="p">({</span>
+  <span class="nx">onClick</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">event</span><span class="p">)</span> <span class="p">{</span><span class="cm">/* do something with this */</span><span class="p">},</span>
+  <span class="nx">render</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+<span class="hll">    <span class="k">return</span> <span class="o">&lt;</span><span class="nx">button</span> <span class="nx">onClick</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">onClick</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="k">this</span><span class="p">)}</span> <span class="o">/&gt;</span><span class="p">;</span>
+</span>  <span class="p">}</span>
+<span class="p">});</span>
+</code></pre></div>
+<p>We wrote <code>React.autoBind</code> as a way to cache the function creation and save on memory usage. Since <code>render</code> can get called multiple times, if you used <code>this.onClick.bind(this)</code> you would actually create a new function on each pass. With React v0.3 you were able to write this instead:</p>
+<div class="highlight"><pre><code class="js language-js" data-lang="js"><span class="nx">React</span><span class="p">.</span><span class="nx">createClass</span><span class="p">({</span>
+<span class="hll">  <span class="nx">onClick</span><span class="o">:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">autoBind</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">event</span><span class="p">)</span> <span class="p">{</span><span class="cm">/* do something with this */</span><span class="p">}),</span>
+</span>  <span class="nx">render</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+<span class="hll">    <span class="k">return</span> <span class="o">&lt;</span><span class="nx">button</span> <span class="nx">onClick</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">onClick</span><span class="p">}</span> <span class="o">/&gt;</span><span class="p">;</span>
+</span>  <span class="p">}</span>
+<span class="p">});</span>
+</code></pre></div>
+<h2>What&#39;s Changing in v0.4?</h2>
+
+<p>After using <code>React.autoBind</code> for a few weeks, we realized that there were very few times that we didn&#39;t want that behavior. So we made it the default! Now all methods defined within <code>React.createClass</code> will already be bound to the correct instance.</p>
+
+<p>Starting with v0.4 you can just write this:</p>
+<div class="highlight"><pre><code class="js language-js" data-lang="js"><span class="nx">React</span><span class="p">.</span><span class="nx">createClass</span><span class="p">({</span>
+<span class="hll">  <span class="nx">onClick</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">event</span><span class="p">)</span> <span class="p">{</span><span class="cm">/* do something with this */</span><span class="p">},</span>
+</span>  <span class="nx">render</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
+<span class="hll">    <span class="k">return</span> <span class="o">&lt;</span><span class="nx">button</span> <span class="nx">onClick</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">onClick</span><span class="p">}</span> <span class="o">/&gt;</span><span class="p">;</span>
+</span>  <span class="p">}</span>
+<span class="p">});</span>
+</code></pre></div>
+<p>For v0.4 we will simply be making <code>React.autoBind</code> a no-op — it will just return the function you pass to it. Most likely you won&#39;t have to change your code to account for this change, though we encourage you to update. We&#39;ll publish a migration guide documenting this and other changes that come along with React v0.4.</p>
+
+    </div>
+
+    <div class="fb-like" data-send="true" data-width="650" data-show-faces="false"></div>
+    <div class="fb-comments" data-width="650" data-num-posts="10" data-href="http://facebook.github.io/react/blog/2013/07/02/react-v0-4-autobind-by-default.html"></div>
+  </div>
+</section>
+
+
+    <footer class="wrap">
+      <div class="left">A Facebook &amp; Instagram collaboration.</div>
+      <div class="right">&copy; 2013 Facebook Inc.</div>
+    </footer>
+  </div>
+  <div id="fb-root"></div>
+  <script>
+    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+    ga('create', 'UA-41298772-1', 'facebook.github.io');
+    ga('send', 'pageview');
+
+    !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
+
+    (function(d, s, id) {
+      var js, fjs = d.getElementsByTagName(s)[0];
+      if (d.getElementById(id)) return;
+      js = d.createElement(s); js.id = id;
+      js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=623268441017527";
+      fjs.parentNode.insertBefore(js, fjs);
+    }(document, 'script', 'facebook-jssdk'));
+  </script>
+</body>
+</html>
diff --git a/blog/index.html b/blog/index.html
index e7ce302468..69e53645ed 100644
--- a/blog/index.html
+++ b/blog/index.html
@@ -57,6 +57,8 @@
     <h3>Recent posts</h3>
     <ul>
     
+      <li><a href="/react/blog/2013/07/02/react-v0-4-autobind-by-default.html">New in React v0.4: Autobind by Default</a></li>
+    
       <li><a href="/react/blog/2013/06/27/community-roundup-3.html">Community Round-up #3</a></li>
     
       <li><a href="/react/blog/2013/06/21/react-v0-3-3.html">React v0.3.3</a></li>
@@ -75,6 +77,23 @@
 
   <div class="inner-content">
     
+      <div class="post-list-item">
+        <h1><a href="/react/blog/2013/07/02/react-v0-4-autobind-by-default.html">New in React v0.4: Autobind by Default</a></h1>
+        <p class="meta">July  2, 2013 by Paul O'Shannessy</p>
+
+        <hr>
+
+        <div class="post">
+         <p>React v0.4 is very close to completion. As we finish it off, we&#39;d like to share with you some of the major changes we&#39;ve made since v0.3. This is the first of several posts we&#39;ll be making over the next week.</p>
+
+         
+           <p>
+             <a href="/react/blog/2013/07/02/react-v0-4-autobind-by-default.html">Continue Reading &rarr;</a>
+          </p>
+         
+        </div>
+      </div>
+    
       <div class="post-list-item">
         <h1><a href="/react/blog/2013/06/27/community-roundup-3.html">Community Round-up #3</a></h1>
         <p class="meta">June 27, 2013 by Vjeux</p>
diff --git a/feed.xml b/feed.xml
index 430417f53b..af7f8e9809 100644
--- a/feed.xml
+++ b/feed.xml
@@ -6,6 +6,49 @@
 		<link>http://facebook.github.io/react</link>
 		<atom:link href="http://facebook.github.io/react/feed.xml" rel="self" type="application/rss+xml" />
 		
+			<item>
+				<title>New in React v0.4: Autobind by Default</title>
+				<description>&lt;p&gt;React v0.4 is very close to completion. As we finish it off, we&amp;#39;d like to share with you some of the major changes we&amp;#39;ve made since v0.3. This is the first of several posts we&amp;#39;ll be making over the next week.&lt;/p&gt;
+
+&lt;h2&gt;What is React.autoBind?&lt;/h2&gt;
+
+&lt;p&gt;If you take a look at most of our current examples, you&amp;#39;ll see us using &lt;code&gt;React.autoBind&lt;/code&gt; for event handlers. This is used in place of &lt;code&gt;Function.prototype.bind&lt;/code&gt;. Remember that in JS, &lt;a href=&quot;http://bonsaiden.github.io/JavaScript-Garden/#function.this&quot;&gt;function calls are late-bound&lt;/a&gt;. That means that if you simply pass a function around, the &lt;code&gt;this&lt;/code&gt; used inside won&amp;#39;t necessarily be the &lt;code&gt;this&lt;/code&gt; you expect. &lt;code&gt;Function.prototype.bind&lt;/code&gt; creates a new, properly bound, function so that when called, &lt;code&gt;this&lt;/code&gt; is exactly what you expect it to be.&lt;/p&gt;
+
+&lt;p&gt;Before we launched React, we would write this:&lt;/p&gt;
+&lt;div class=&quot;highlight&quot;&gt;&lt;pre&gt;&lt;code class=&quot;js language-js&quot; data-lang=&quot;js&quot;&gt;&lt;span class=&quot;nx&quot;&gt;React&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;nx&quot;&gt;createClass&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;({&lt;/span&gt;
+  &lt;span class=&quot;nx&quot;&gt;onClick&lt;/span&gt;&lt;span class=&quot;o&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;kd&quot;&gt;function&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;nx&quot;&gt;event&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;)&lt;/span&gt; &lt;span class=&quot;p&quot;&gt;{&lt;/span&gt;&lt;span class=&quot;cm&quot;&gt;/* do something with this */&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},&lt;/span&gt;
+  &lt;span class=&quot;nx&quot;&gt;render&lt;/span&gt;&lt;span class=&quot;o&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;kd&quot;&gt;function&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;()&lt;/span&gt; &lt;span class=&quot;p&quot;&gt;{&lt;/span&gt;
+&lt;span class=&quot;hll&quot;&gt;    &lt;span class=&quot;k&quot;&gt;return&lt;/span&gt; &lt;span class=&quot;o&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;nx&quot;&gt;button&lt;/span&gt; &lt;span class=&quot;nx&quot;&gt;onClick&lt;/span&gt;&lt;span class=&quot;o&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;{&lt;/span&gt;&lt;span class=&quot;k&quot;&gt;this&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;nx&quot;&gt;onClick&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;nx&quot;&gt;bind&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;k&quot;&gt;this&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;)}&lt;/span&gt; &lt;span class=&quot;o&quot;&gt;/&amp;gt;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;;&lt;/span&gt;
+&lt;/span&gt;  &lt;span class=&quot;p&quot;&gt;}&lt;/span&gt;
+&lt;span class=&quot;p&quot;&gt;});&lt;/span&gt;
+&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;
+&lt;p&gt;We wrote &lt;code&gt;React.autoBind&lt;/code&gt; as a way to cache the function creation and save on memory usage. Since &lt;code&gt;render&lt;/code&gt; can get called multiple times, if you used &lt;code&gt;this.onClick.bind(this)&lt;/code&gt; you would actually create a new function on each pass. With React v0.3 you were able to write this instead:&lt;/p&gt;
+&lt;div class=&quot;highlight&quot;&gt;&lt;pre&gt;&lt;code class=&quot;js language-js&quot; data-lang=&quot;js&quot;&gt;&lt;span class=&quot;nx&quot;&gt;React&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;nx&quot;&gt;createClass&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;({&lt;/span&gt;
+&lt;span class=&quot;hll&quot;&gt;  &lt;span class=&quot;nx&quot;&gt;onClick&lt;/span&gt;&lt;span class=&quot;o&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;nx&quot;&gt;React&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;nx&quot;&gt;autoBind&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;kd&quot;&gt;function&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;nx&quot;&gt;event&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;)&lt;/span&gt; &lt;span class=&quot;p&quot;&gt;{&lt;/span&gt;&lt;span class=&quot;cm&quot;&gt;/* do something with this */&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;}),&lt;/span&gt;
+&lt;/span&gt;  &lt;span class=&quot;nx&quot;&gt;render&lt;/span&gt;&lt;span class=&quot;o&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;kd&quot;&gt;function&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;()&lt;/span&gt; &lt;span class=&quot;p&quot;&gt;{&lt;/span&gt;
+&lt;span class=&quot;hll&quot;&gt;    &lt;span class=&quot;k&quot;&gt;return&lt;/span&gt; &lt;span class=&quot;o&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;nx&quot;&gt;button&lt;/span&gt; &lt;span class=&quot;nx&quot;&gt;onClick&lt;/span&gt;&lt;span class=&quot;o&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;{&lt;/span&gt;&lt;span class=&quot;k&quot;&gt;this&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;nx&quot;&gt;onClick&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;}&lt;/span&gt; &lt;span class=&quot;o&quot;&gt;/&amp;gt;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;;&lt;/span&gt;
+&lt;/span&gt;  &lt;span class=&quot;p&quot;&gt;}&lt;/span&gt;
+&lt;span class=&quot;p&quot;&gt;});&lt;/span&gt;
+&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;
+&lt;h2&gt;What&amp;#39;s Changing in v0.4?&lt;/h2&gt;
+
+&lt;p&gt;After using &lt;code&gt;React.autoBind&lt;/code&gt; for a few weeks, we realized that there were very few times that we didn&amp;#39;t want that behavior. So we made it the default! Now all methods defined within &lt;code&gt;React.createClass&lt;/code&gt; will already be bound to the correct instance.&lt;/p&gt;
+
+&lt;p&gt;Starting with v0.4 you can just write this:&lt;/p&gt;
+&lt;div class=&quot;highlight&quot;&gt;&lt;pre&gt;&lt;code class=&quot;js language-js&quot; data-lang=&quot;js&quot;&gt;&lt;span class=&quot;nx&quot;&gt;React&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;nx&quot;&gt;createClass&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;({&lt;/span&gt;
+&lt;span class=&quot;hll&quot;&gt;  &lt;span class=&quot;nx&quot;&gt;onClick&lt;/span&gt;&lt;span class=&quot;o&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;kd&quot;&gt;function&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;(&lt;/span&gt;&lt;span class=&quot;nx&quot;&gt;event&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;)&lt;/span&gt; &lt;span class=&quot;p&quot;&gt;{&lt;/span&gt;&lt;span class=&quot;cm&quot;&gt;/* do something with this */&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},&lt;/span&gt;
+&lt;/span&gt;  &lt;span class=&quot;nx&quot;&gt;render&lt;/span&gt;&lt;span class=&quot;o&quot;&gt;:&lt;/span&gt; &lt;span class=&quot;kd&quot;&gt;function&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;()&lt;/span&gt; &lt;span class=&quot;p&quot;&gt;{&lt;/span&gt;
+&lt;span class=&quot;hll&quot;&gt;    &lt;span class=&quot;k&quot;&gt;return&lt;/span&gt; &lt;span class=&quot;o&quot;&gt;&amp;lt;&lt;/span&gt;&lt;span class=&quot;nx&quot;&gt;button&lt;/span&gt; &lt;span class=&quot;nx&quot;&gt;onClick&lt;/span&gt;&lt;span class=&quot;o&quot;&gt;=&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;{&lt;/span&gt;&lt;span class=&quot;k&quot;&gt;this&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;.&lt;/span&gt;&lt;span class=&quot;nx&quot;&gt;onClick&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;}&lt;/span&gt; &lt;span class=&quot;o&quot;&gt;/&amp;gt;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;;&lt;/span&gt;
+&lt;/span&gt;  &lt;span class=&quot;p&quot;&gt;}&lt;/span&gt;
+&lt;span class=&quot;p&quot;&gt;});&lt;/span&gt;
+&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;
+&lt;p&gt;For v0.4 we will simply be making &lt;code&gt;React.autoBind&lt;/code&gt; a no-op — it will just return the function you pass to it. Most likely you won&amp;#39;t have to change your code to account for this change, though we encourage you to update. We&amp;#39;ll publish a migration guide documenting this and other changes that come along with React v0.4.&lt;/p&gt;
+</description>
+				<pubDate>2013-07-02T00:00:00-07:00</pubDate>
+				<link>http://facebook.github.io/react/blog/2013/07/02/react-v0-4-autobind-by-default.html</link>
+				<guid isPermaLink="true">http://facebook.github.io/react/blog/2013/07/02/react-v0-4-autobind-by-default.html</guid>
+			</item>
+		
 			<item>
 				<title>Community Round-up #3</title>
 				<description>&lt;p&gt;The highlight of this week is that an interaction-heavy app has been ported to React. React components are solving issues they had with nested views.&lt;/p&gt;