Alternatives to JW Player

Is videojs a super set of all features of HTML5 video player or is anything missing from videojs player that html5 is offering?

Few years ago we were building a Next.js site with a few simple forms. This required handling forms validation and submission, but instead of picking some forms library, we went with plain JavaScript and constraint validation API in HTML5. This shaved off a few KBs of dependencies and gave us full control over the validation behavior and look. I describe this approach, with its pros and cons, in a blog post.

I needed to choose a full stack of tools for cross platform mobile application design & development. After much research and trying different tools, these are what I came up with that work for me today:

For the client coding I chose Framework7 because of its performance, easy learning curve, and very well designed, beautiful UI widgets. I think it's perfect for solo development or small teams. I didn't like React Native. It felt heavy to me and rigid. Framework7 allows the use of #CSS3, which I think is the best technology to come out of the #WWW movement. No other tech has been able to allow designers and developers to develop such flexible, high performance, customisable user interface elements that are highly responsive and hardware accelerated before. Now #CSS3 includes variables and flexboxes it is truly a powerful language and there is no longer a need for preprocessors such as #SCSS / #Sass / #less. React Native contains a very limited interpretation of #CSS3 which I found very frustrating after using #CSS3 for some years already and knowing its powerful features. The other very nice feature of Framework7 is that you can even build for the browser if you want your app to be available for desktop web browsers. The latest release also includes the ability to build for #Electron so you can have MacOS, Windows and Linux desktop apps. This is not possible with React Native yet.

Framework7 runs on top of Apache Cordova. Cordova and webviews have been slated as being slow in the past. Having a game developer background I found the tweeks to make it run as smooth as silk. One of those tweeks is to use WKWebView. Another important one was using srcset on images.

I use #Template7 for the for the templating system which is a no-nonsense mobile-centric #HandleBars style extensible templating system. It's easy to write custom helpers for, is fast and has a small footprint. I'm not forced into a new paradigm or learning some new syntax. It operates with standard JavaScript, HTML5 and CSS 3. It's written by the developer of Framework7 and so dovetails with it as expected.

I configured TypeScript to work with the latest version of Framework7. I consider TypeScript to be one of the best creations to come out of Microsoft in some time. They must have an amazing team working on it. It's very powerful and flexible. It helps you catch a lot of bugs and also provides code completion in supporting IDEs. So for my IDE I use Visual Studio Code which is a blazingly fast and silky smooth editor that integrates seamlessly with TypeScript for the ultimate type checking setup (both products are produced by Microsoft).

I use Webpack and Babel to compile the JavaScript. TypeScript can compile to JavaScript directly but Babel offers a few more options and polyfills so you can use the latest (and even prerelease) JavaScript features today and compile to be backwards compatible with virtually any browser. My favorite recent addition is "optional chaining" which greatly simplifies and increases readability of a number of sections of my code dealing with getting and setting data in nested objects.

I use some Ruby scripts to process images with ImageMagick and pngquant to optimise for size and even auto insert responsive image code into the HTML5. Ruby is the ultimate cross platform scripting language. Even as your scripts become large, Ruby allows you to refactor your code easily and make it Object Oriented if necessary. I find it the quickest and easiest way to maintain certain aspects of my build process.

For the user interface design and prototyping I use Figma. Figma has an almost identical user interface to #Sketch but has the added advantage of being cross platform (MacOS and Windows). Its real-time collaboration features are outstanding and I use them a often as I work mostly on remote projects. Clients can collaborate in real-time and see changes I make as I make them. The clickable prototyping features in Figma are also very well designed and mean I can send clickable prototypes to clients to try user interface updates as they are made and get immediate feedback. I'm currently also evaluating the latest version of #AdobeXD as an alternative to Figma as it has the very cool auto-animate feature. It doesn't have real-time collaboration yet, but I heard it is proposed for 2019.

For the UI icons I use Font Awesome Pro. They have the largest selection and best looking icons you can find on the internet with several variations in styles so you can find most of the icons you want for standard projects.

For the backend I was using the #GraphCool Framework. As I later found out, #GraphQL still has some way to go in order to provide the full power of a mature graph query language so later in my project I ripped out #GraphCool and replaced it with CouchDB and Pouchdb. Primarily so I could provide good offline app support. CouchDB with Pouchdb is very flexible and efficient combination and overcomes some of the restrictions I found in #GraphQL and hence #GraphCool also. The most impressive and important feature of CouchDB is its replication. You can configure it in various ways for backups, fault tolerance, caching or conditional merging of databases. CouchDB and Pouchdb even supports storing, retrieving and serving binary or image data or other mime types. This removes a level of complexity usually present in database implementations where binary or image data is usually referenced through an #HTML5 link. With CouchDB and Pouchdb apps can operate offline and sync later, very efficiently, when the network connection is good.

I use PhoneGap when testing the app. It auto-reloads your app when its code is changed and you can also install it on Android phones to preview your app instantly. iOS is a bit more tricky cause of Apple's policies so it's not available on the App Store, but you can build it and install it yourself to your device.

So that's my latest mobile stack. What tools do you use? Have you tried these ones?

This is my stack in Application & Data

JavaScript PHP HTML5 jQuery Redis Amazon EC2 Ubuntu Sass Vue.js Firebase Laravel Lumen Amazon RDS GraphQL MariaDB

My Utilities Tools

Google Analytics Postman Elasticsearch

My Devops Tools

Git GitHub GitLab npm Visual Studio Code Kibana Sentry BrowserStack

My Business Tools

Slack

Functionally, Amplitude and Mixpanel are incredibly similar. They both offer almost all the same functionality around tracking and visualizing user actions for analytics. You can track A/B test results in both. We ended up going with Amplitude at BaseDash because it has a more generous free tier for our uses (10 million actions per month, versus Mixpanel's 1000 monthly tracked users).

Segment isn't meant to compete with these tools, but instead acts as an API to send actions to them, and other analytics tools. If you're just sending event data to one of these tools, you probably don't need Segment. If you're using other analytics tools like Google Analytics and FullStory, Segment makes it easy to send events to all your tools at once.

Hi,

This is a question for best practice regarding Segment and Google Tag Manager. I would love to use Segment and GTM together when we need to implement a lot of additional tools, such as Amplitude, Appsfyler, or any other engagement tool since we can send event data without additional SDK implementation, etc.

So, my question is, if you use Segment and Google Tag Manager, how did you define what you will push through Segment and what will you push through Google Tag Manager? For example, when implementing a Facebook Pixel or any other 3rd party marketing tag?

From my point of view, implementing marketing pixels should stay in GTM because of the tag/trigger control.

If you are using Segment and GTM together, I would love to learn more about your best practice.

Thanks!

Functionally, Amplitude and Mixpanel are incredibly similar. They both offer almost all the same functionality around tracking and visualizing user actions for analytics. You can track A/B test results in both. We ended up going with Amplitude at BaseDash because it has a more generous free tier for our uses (10 million actions per month, versus Mixpanel's 1000 monthly tracked users).

Segment isn't meant to compete with these tools, but instead acts as an API to send actions to them, and other analytics tools. If you're just sending event data to one of these tools, you probably don't need Segment. If you're using other analytics tools like Google Analytics and FullStory, Segment makes it easy to send events to all your tools at once.

Hi there, we are a seed-stage startup in the personal development space. I am looking at building the marketing stack tool to have an accurate view of the user experience from acquisition through to adoption and retention for our upcoming React Native Mobile app. We qualify for the startup program of Segment and Mixpanel, which seems like a good option to get rolling and scale for free to learn how our current 60K free members will interact in the new subscription-based platform. I was considering AppsFlyer for attribution, and I am now looking at an affordable yet scalable Mobile Marketing tool vs. building in-house. Braze looks great, so does Leanplum, but the price points are 30K to start, which we can't do. I looked at OneSignal, but it doesn't have user flow visualization. I am now looking into Urban Airship and Iterable. Any advice would be much appreciated!

Functionally, Amplitude and Mixpanel are incredibly similar. They both offer almost all the same functionality around tracking and visualizing user actions for analytics. You can track A/B test results in both. We ended up going with Amplitude at BaseDash because it has a more generous free tier for our uses (10 million actions per month, versus Mixpanel's 1000 monthly tracked users).

Segment isn't meant to compete with these tools, but instead acts as an API to send actions to them, and other analytics tools. If you're just sending event data to one of these tools, you probably don't need Segment. If you're using other analytics tools like Google Analytics and FullStory, Segment makes it easy to send events to all your tools at once.

Hi there, we are a seed-stage startup in the personal development space. I am looking at building the marketing stack tool to have an accurate view of the user experience from acquisition through to adoption and retention for our upcoming React Native Mobile app. We qualify for the startup program of Segment and Mixpanel, which seems like a good option to get rolling and scale for free to learn how our current 60K free members will interact in the new subscription-based platform. I was considering AppsFlyer for attribution, and I am now looking at an affordable yet scalable Mobile Marketing tool vs. building in-house. Braze looks great, so does Leanplum, but the price points are 30K to start, which we can't do. I looked at OneSignal, but it doesn't have user flow visualization. I am now looking into Urban Airship and Iterable. Any advice would be much appreciated!