How HBO’s Silicon Valley built “Not Hotdog” with mobile TensorFlow, Keras & React Native

How HBO’s Silicon Valley built “Not Hotdog” with mobile TensorFlow, Keras & React Native

  • While this is a subject of some debate these days, our experiments placing BN after activation on small networks failed to converge as well.To optimize the network we used Cyclical Learning Rates and (fellow student) Brad Kenstler’s excellent Keras implementation.
  • This was hard to defend against as a) there just aren’t that many photographs of hotdogs in soft focus (we get hungry just thinking about it) and b) it could be damaging to spend too much of our network’s capacity training for soft focus, when realistically most images taken with a mobile phone will not have that feature.
  • Of the remaining 147k images, most were of food, with just 3k photos of non-food items, to help the network generalize a bit more and not get tricked into seeing a hotdog if presented with an image of a human in a red outfit.Our data augmentation rules were as follows:We applied rotations within Âą135 degrees — significantly more than average, because we coded the application to disregard phone orientation.Height and width shifts of 20%Shear range of 30%Zoom range of 10%Channel shifts of 20%Random horizontal flips to help the network generalizeThese numbers were derived intuitively, based on experiments and our understanding of the real-life usage of our app, as opposed to careful experimentation.The final key to our data pipeline was using Patrick Rodriguez’s multiprocess image data generator for Keras.
  • Phase 2 ran for 64 more epochs (4 CLR cycles with a step size of 8 epochs), with a learning rate between 0.0004 and 0.0045, on a triangular 2 policy.Phase 3 ran for 64 more epochs (4 CLR cycles with a step size of 8 epochs), with a learning rate between 0.000015 and 0.0002, on a triangular 2 policy.While learning rates were identified by running the linear experiment recommended by the CLR paper, they seem to intuitively make sense, in that the max for each phase is within a factor of 2 of the previous minimum, which is aligned with the industry standard recommendation of halving your learning rate if your accuracy plateaus during training.We were able to perform some runs on a Paperspace P5000 instance in the interest of time.
  • In those cases, we were able to double the batch size, and found that optimal learning rates for each phase were roughly double as well.Running Neural Networks on Mobile PhonesEven having designed a relatively compact neural architecture, and having trained it to handle situations it may find in a mobile context, we had a lot of work left

How Silicon Valley build the real AI app that identifies hotdogs — and not hotdogs using mobile TensorFlow, Keras & React Native.
Continue reading “How HBO’s Silicon Valley built “Not Hotdog” with mobile TensorFlow, Keras & React Native”

Reactjs vs Vuejs – What to Choose? #Vuejs #Reactjs #js

Reactjs vs Vuejs - What to Choose?
#Vuejs #Reactjs #js

  • Pros and cons of vue js
    Vue.js – is a JavaScript-framework that uses the MVVM pattern for creating user interfaces based on data models through reactive binding data.
  • A developer might not know how to use it but he should have heard about Vue js, because the framework became popular in past few years the number of use the words “Vue js” and “Vue.js” in Google trend in 2016 was more than in four times higher comparing to 2015.
  • Advantages of vue js:

    Having borrowed from older frameworks, such as Angular and React only the best, Vue.js stands the perfect balance between readability, maintainability of code and the pleasure of it, this code, writing.

  • From React Vue.js took a component approach, props, one-way data flow for the component hierarchy, performance, the ability to render on the backend and understanding the importance of proper state management.
  • This makes it easy to add the Vue library to the project, like jQuery.All this is possible in the React library, but generally the code written on React relies more on JSX and on the features of ES.

Both React.js and Vue.js have benefits and disadvantages, that may confuse a potential client at first. We’re going to make their comparison in this article.

Continue reading “Reactjs vs Vuejs – What to Choose?
#Vuejs #Reactjs #js”

React Behavioral Wrapper Components – Ian Carlson – Medium

React Behavioral Wrapper Components  #ui #react #javascript #reactjs

  • But because of how flexible React is you can create wrapper components that add behavior to the children being passed through.
  • This is more applicable when using Redux since not all the backend requests are made within the same component, like a session container for example.Here’s a example of creating an opacity animation component that adds the animation to any child component.
  • This is based on the example in the React documentation using the CSS transition group extension to apply fade-in, fade-out animations based on the lifecycle of the child component(s).
  • The former is actual animation time and the latter is how long temporary classes will stay in existence.Here’s an example of how to use the OpacityAnimation:You can also pass an array of children as well, but it’s important to carefully manage the key properties on each child — even for just one child.
  • For example, a tooltip component would display the children as is, but then attach event handlers to display the tooltip on the right conditions.

Another great thing about React is how easy it is to add behavior to components through composition. Typically new people only think of composition in terms of layout. But because of how flexible…
Continue reading “React Behavioral Wrapper Components – Ian Carlson – Medium”

Congratulations on 🌟50,000🌟 stars, @reactnative! Here’s to the next 50,000 🥂

  • Another great way to learn more about the components and APIs included with React Native is to read their source.
  • The React Native documentation only discusses the components, APIs and topics specific to React Native (React on iOS and Android).
  • For further documentation on the React API that is shared between React Native and React DOM, refer to the React documentation.
  • If you encounter a bug with React Native we would like to hear about it.
  • For help and questions with using React Native please make use of the resources listed in the Getting Help section.

react-native – A framework for building native apps with React.
Continue reading “Congratulations on 🌟50,000🌟 stars, @reactnative! Here’s to the next 50,000 🥂”

React and React Native [Book]

Adam Boduch's

  • Use React and React Native to build applications for desktop browsers, mobile browsers, and even as native mobile apps

    Who This Book Is For

    This book is written for any JavaScript developer—beginner or expert—who wants to start learning how to put both of Facebook’s UI libraries to work.

  • What You Will Learn

    React and React Native allow you to build cross-platform desktop and mobile applications using Facebook’s innovative UI libraries.

  • The first part shows you how to start crafting composable UIs using React, from rendering with JSX and creating reusable components through to routing and creating isomorphic applications that run on Node.
  • We then move on to showing you how to take the concepts of React and apply them to building Native UIs using React Native.
  • Split into three major sections to help organize your learning, this hands-on, code-first book will help you get up to speed with React and React Native—the UI framework that powers Netflix, Yahoo, and Facebook.

Use React and React Native to build applications for desktop browsers, mobile browsers, and even as native mobile apps About This Book Build React and React Native applications using familiar … – Selection from React and React Native [Book]
Continue reading “React and React Native [Book]”

React Native Pitfalls – Anton Kulyk – Medium

React Native Pitfalls  #reactnative #react #reactjs #reactjs

  • React Native PitfallsThere are a lot of collections of anti-patterns for React and different app’s state managers like Redux and MobX (e.g. react-bits), but I haven’t seen a lot of advises for React Native developers.
  • You can create bridges between JavaScript and native modules, enable messaging between two sides of an app, create your own components.
  • Sometimes just a few lines of native code can save you from dozens of unneeded JavaScript.Do not estimate Android iOS equallyPersonally I spend much more time on configuring iOS apps.
  • Your apps are native and that’s awesome, but Android and iOS are different platforms, with different guidelines and components.
  • So develop and test both versions in parallel.Test on a device from the day oneEmulators are nice, but use devices, especially on Android because of variety of screen sizes, OS versions is use, etc.It won’t be iOS/Android only storySometimes people pick React Native for developing an app only for one platform (yep, seriously).

There are a lot of collections of anti-patterns for React and different app’s state managers like Redux and MobX (e.g. react-bits), but I haven’t seen a lot of advises for React Native developers. In…
Continue reading “React Native Pitfalls – Anton Kulyk – Medium”