diff --git a/glazier-react.cabal b/glazier-react.cabal
--- a/glazier-react.cabal
+++ b/glazier-react.cabal
@@ -1,5 +1,5 @@
 name:                glazier-react
-version:             0.5.0.0
+version:             0.6.0.0
 synopsis:            ReactJS binding using Glazier and Pipes.Fluid
 description:         ReactJS binding using Glazier and Pipes.Fluid, which is
                      more functional and composable than Elm/Flux.
@@ -36,7 +36,7 @@
                      , dlist >= 0.8 && < 0.9
                      , free >= 4.12 && < 5
                      , glazier >= 0.10 && < 1
-                     , javascript-extras >= 0.2.0.2 && < 1
+                     , javascript-extras >= 0.3.0.0 && < 1
                      , lens >= 4 && < 5
                      , mmorph >= 1 && < 2
                      , mtl >= 2 && < 3
diff --git a/src/Glazier/React/Command.hs b/src/Glazier/React/Command.hs
--- a/src/Glazier/React/Command.hs
+++ b/src/Glazier/React/Command.hs
@@ -24,4 +24,4 @@
     i <- JE.toJS <$> use frameNum
     r <- use componentRef
     sm <- get
-    pure $ fcmd sm [("frameNum", i)] r
+    pure $ fcmd sm [("frameNum", JE.JSVar i)] r
diff --git a/src/Glazier/React/Component.hs b/src/Glazier/React/Component.hs
--- a/src/Glazier/React/Component.hs
+++ b/src/Glazier/React/Component.hs
@@ -8,7 +8,7 @@
 import qualified Control.Disposable as CD
 import qualified GHCJS.Types as J
 import qualified GHCJS.Marshal.Pure as J
-import qualified JavaScript.Extras.Recast as JE
+import qualified JavaScript.Extras.Cast as JE
 
 -- | A newtype wrapper to give a noop disposable instance to React components
 -- This allows generic deriving of model Adaptors.
diff --git a/src/Glazier/React/Element.hs b/src/Glazier/React/Element.hs
--- a/src/Glazier/React/Element.hs
+++ b/src/Glazier/React/Element.hs
@@ -26,19 +26,19 @@
 -- | Unfortunately, ReactJS did not export an easy way to check if something is a ReactElement,
 -- although they do so in the internal code with REACT_ELEMENT_TYPE.
 -- This function allow coercing a ReactElement from a JSVal
--- and is marked unsafe as a reminder that the coersion is unchecked.
+-- and is named unsafe as a reminder that the coersion is unchecked.
 -- This function is required when receiving ReactElement from javascript (eg in a callback)
 -- or to interface with foreign React Elements.
 unsafeCoerceElement :: J.JSVal -> ReactElement
 unsafeCoerceElement = ReactElement
 
 -- | Create a react element (with children) from a HashMap of properties
-mkBranchElement :: J.JSVal -> [JE.Property] -> [ReactElement] -> IO ReactElement
+mkBranchElement :: JE.JSVar -> [JE.Property] -> [ReactElement] -> IO ReactElement
 mkBranchElement n props xs =
     js_mkBranchElement n (JE.fromProperties props) (JA.fromList $ JE.toJS <$> xs)
 
 -- | Create a react element (with no children) from a HashMap of properties
-mkLeafElement :: J.JSVal -> [JE.Property] -> IO ReactElement
+mkLeafElement :: JE.JSVar -> [JE.Property] -> IO ReactElement
 mkLeafElement n props =
     js_mkLeafElement n (JE.fromProperties props)
 
@@ -59,11 +59,11 @@
 -- and JSArray are mutable.
 foreign import javascript unsafe
     "$r = React.createElement($1, $2, $3);"
-    js_mkBranchElement :: J.JSVal -> JO.Object -> JA.JSArray -> IO ReactElement
+    js_mkBranchElement :: JE.JSVar -> JO.Object -> JA.JSArray -> IO ReactElement
 
 foreign import javascript unsafe
     "$r = React.createElement($1, $2);"
-    js_mkLeafElement :: J.JSVal -> JO.Object -> IO ReactElement
+    js_mkLeafElement :: JE.JSVar -> JO.Object -> IO ReactElement
 
 foreign import javascript unsafe
     "$r = $1;"
@@ -79,10 +79,10 @@
 -- | This is an IO action because even if the same args was used
 -- a different ReactElement may be created, because JSVal
 -- and JSArray are mutable.
-js_mkBranchElement :: J.JSVal -> JO.Object -> JA.JSArray -> IO ReactElement
+js_mkBranchElement :: JE.JSVar -> JO.Object -> JA.JSArray -> IO ReactElement
 js_mkBranchElement _ _ _ = pure (ReactElement J.nullRef)
 
-js_mkLeafElement :: J.JSVal -> JO.Object -> IO ReactElement
+js_mkLeafElement :: JE.JSVar -> JO.Object -> IO ReactElement
 js_mkLeafElement _ _ =  pure (ReactElement J.nullRef)
 
 js_textElement :: J.JSString -> ReactElement
diff --git a/src/Glazier/React/Event.hs b/src/Glazier/React/Event.hs
--- a/src/Glazier/React/Event.hs
+++ b/src/Glazier/React/Event.hs
@@ -30,7 +30,7 @@
 import qualified GHCJS.Foreign as J
 import qualified GHCJS.Marshal.Pure as J
 import qualified GHCJS.Types as J
-import qualified JavaScript.Extras.Recast as JE
+import qualified JavaScript.Extras.Cast as JE
 
 -- | The object that dispatched the event.
 -- https://developer.mozilla.org/en-US/docs/Web/API/Event/target
@@ -41,8 +41,8 @@
     pToJSVal = J.jsval
 instance JE.ToJS DOMEventTarget
 instance JE.FromJS DOMEventTarget where
-    fromJS a | js_isDOMEventTarget a = pure . Just $ DOMEventTarget a
-    fromJS _ = pure Nothing
+    fromJS a | js_isDOMEventTarget a = Just $ DOMEventTarget a
+    fromJS _ = Nothing
 
 -- | The native event
 -- https://developer.mozilla.org/en-US/docs/Web/API/Event
@@ -53,8 +53,8 @@
     pToJSVal = J.jsval
 instance JE.ToJS DOMEvent
 instance JE.FromJS DOMEvent where
-    fromJS a | js_isDOMEvent a = pure . Just $ DOMEvent a
-    fromJS _ = pure Nothing
+    fromJS a | js_isDOMEvent a = Just $ DOMEvent a
+    fromJS _ = Nothing
 
 -- | Every event in React is a synthetic event, a cross-browser wrapper around the native event.
 -- 'SyntheticEvent' must only be used in the first part of 'eventHandler'.
@@ -65,8 +65,8 @@
     pToJSVal = J.jsval
 instance JE.ToJS SyntheticEvent
 instance JE.FromJS SyntheticEvent where
-    fromJS a | js_isSyntheticEvent a = pure . Just $ SyntheticEvent a
-    fromJS _ = pure Nothing
+    fromJS a | js_isSyntheticEvent a = Just $ SyntheticEvent a
+    fromJS _ = Nothing
 
 -- | Using the NFData idea from React/Flux/PropertiesAndEvents.hs
 -- React re-uses SyntheticEvent from a pool, which means it may no longer be valid if we lazily
@@ -132,9 +132,12 @@
 unsafeProperty :: J.PFromJSVal a => J.JSVal -> J.JSString -> a
 unsafeProperty v = J.pFromJSVal . js_unsafeProperty v
 
-parseEvent :: SyntheticEvent -> IO Event
+-- | We can lie about this not being in IO because
+-- within the strict part of 'eventHandlerM'
+-- the SyntheticEvent is effectively immutable.
+parseEvent :: SyntheticEvent -> Event
 parseEvent (SyntheticEvent evt) =
-    pure $ Event
+    Event
     { bubbles = unsafeProperty evt "bubbles"
     , cancelable = unsafeProperty evt "cancelable"
     , currentTarget = DOMEventTarget $ js_unsafeProperty evt "currentTarget"
@@ -183,8 +186,8 @@
 -- | We can lie about this not being in IO because
 -- within the strict part of 'eventHandlerM'
 -- the SyntheticEvent is effectively immutable.
-parseMouseEvent :: SyntheticEvent -> IO (Maybe MouseEvent)
-parseMouseEvent (SyntheticEvent evt) | js_isMouseEvent (js_unsafeProperty evt "nativeEvent") = pure $ Just $
+parseMouseEvent :: SyntheticEvent -> Maybe MouseEvent
+parseMouseEvent (SyntheticEvent evt) | js_isMouseEvent (js_unsafeProperty evt "nativeEvent") = Just $
     MouseEvent
     { altKey = unsafeProperty evt "altKey"
     , button = unsafeProperty evt "button"
@@ -201,7 +204,7 @@
     , screenY = unsafeProperty evt "xcreenY"
     , shiftKey = unsafeProperty evt "shiftKey"
     }
-parseMouseEvent _ | otherwise = pure Nothing
+parseMouseEvent _ | otherwise = Nothing
 
 -- | Keyboard events
 -- 'KeyboardEvent' must only be used in the first part of 'eventHandler'.
@@ -226,8 +229,8 @@
 -- | We can lie about this not being in IO because
 -- within the strict part of 'eventHandlerM'
 -- the SyntheticEvent is effectively immutable.
-parseKeyboardEvent :: SyntheticEvent -> IO (Maybe KeyboardEvent)
-parseKeyboardEvent (SyntheticEvent evt) | js_isKeyboardEvent (js_unsafeProperty evt "nativeEvent") = pure $ Just $
+parseKeyboardEvent :: SyntheticEvent -> Maybe KeyboardEvent
+parseKeyboardEvent (SyntheticEvent evt) | js_isKeyboardEvent (js_unsafeProperty evt "nativeEvent") = Just $
     KeyboardEvent
     { altKey = unsafeProperty evt "altKey"
     , charCode = unsafeProperty evt "charCode"
@@ -242,7 +245,7 @@
     , shiftkey = unsafeProperty evt "shiftkey"
     , which = unsafeProperty evt "which"
     }
-parseKeyboardEvent _ | otherwise = pure Nothing
+parseKeyboardEvent _ | otherwise = Nothing
 
 #ifdef __GHCJS__
 
diff --git a/src/Glazier/React/Markup.hs b/src/Glazier/React/Markup.hs
--- a/src/Glazier/React/Markup.hs
+++ b/src/Glazier/React/Markup.hs
@@ -40,13 +40,13 @@
 
 -- | The parameters required to create a branch ReactElement with children
 data BranchParam = BranchParam
-    J.JSVal
+    JE.JSVar
     [JE.Property]
     (D.DList ReactMarkup)
 
 -- | The parameters required to create a leaf ReactElement (no children)
 data LeafParam = LeafParam
-    J.JSVal
+    JE.JSVar
     [JE.Property]
 
 data ReactMarkup
@@ -123,11 +123,11 @@
 txt n = ReactMlT . StateT $ \xs -> pure ((), xs `D.snoc` TextMarkup n)
 
 -- | For the contentless elements: eg 'br_'
-lf :: Applicative m => J.JSVal -> [JE.Property] -> ReactMlT m ()
+lf :: Applicative m => JE.JSVar -> [JE.Property] -> ReactMlT m ()
 lf n props = ReactMlT . StateT $ \xs -> pure ((), xs `D.snoc` LeafMarkup (LeafParam n props))
 
 -- | For the contentful elements: eg 'div_'
-bh :: Functor m => J.JSVal -> [JE.Property] -> ReactMlT m a -> ReactMlT m a
+bh :: Functor m => JE.JSVar -> [JE.Property] -> ReactMlT m a -> ReactMlT m a
 bh n props (ReactMlT (StateT childs)) = ReactMlT . StateT $ \xs -> do
     (a, childs') <- childs mempty
     pure (a, xs `D.snoc` BranchMarkup (BranchParam n props childs'))