Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Save more on your purchases! discount-offer-chevron-icon
Savings automatically calculated. No voucher code required.
Arrow left icon
All Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Newsletter Hub
Free Learning
Arrow right icon
timer SALE ENDS IN
0 Days
:
00 Hours
:
00 Minutes
:
00 Seconds

Tech News - Web Development

354 Articles
article-image-node-js-v10-12-0-current-released
Sugandha Lahoti
11 Oct 2018
4 min read
Save for later

Node.js v10.12.0 (Current) released

Sugandha Lahoti
11 Oct 2018
4 min read
Node.js v10.12.0 was released, yesterday, with notable changes to assert, cli, crypto, fs, and more. However, the Node.js API is still somewhat changing, and as it matures, certain parts are more reliable than others. Hence throughout the v10.12.0 documentation are indications of a section's stability. Let’s look at the notable changes which are stable. Assert module Changes have been made to assert. The assert module provides a simple set of assertion tests that can be used to test invariants. It comprises of a strict mode and a legacy mode, although it is recommended to only use strict mode. In Node.js v10.12.0, the diff output is now improved by sorting object properties when inspecting the values that are compared with each other. Changes to cli The command line interface in Node.js v10.12.0 has two improvements: The options parser now normalizes _ to - in all multi-word command-line flags, e.g. --no_warnings has the same effect as --no-warnings. It also includes bash completion for the node binary. Users can generate a bash completion script with run node --completion-bash. The output can be saved to a file which can be sourced to enable completion. Crypto Module The crypto module provides cryptographic functionality that includes a set of wrappers for OpenSSL's hash, HMAC, cipher, decipher, sign, and verify functions. In Node.js v10.12.0, crypto adds support for PEM-level encryption. It also supports API asymmetric key pair generation. The new methods crypto.generateKeyPair and crypto.generateKeyPairSync can be used to generate public and private key pairs. The API supports RSA, DSA and EC and a variety of key encodings (both PEM and DER). Improvements to file system The fs module provides an API for interacting with the file system in a manner closely modeled around standard POSIX functions. Node.js v10.12.0 adds a recursive option to fs.mkdir and fs.mkdirSync. On setting this option to true, non-existing parent folders will be automatically created. Updates to Http/2 The http2 module provides an implementation of the HTTP/2 protocol. The new node.js version adds support for a 'ping' event to Http2Session that is emitted whenever a non-ack PING is received. Support is also added for the ORIGIN frame.  Also, nghttp2 is updated to v1.34.0. This adds RFC 8441 extended connect protocol support to allow the use of WebSockets over HTTP/2. Changes in module In the Node.js module system, each file is treated as a separate module. Module has also been updated in v10.12.0. It adds module.createRequireFromPath(filename). This new method can be used to create a custom require function that will resolve modules relative to the filename path. Improvements to process The process object is a global that provides information about, and control over, the current Node.js process. Process adds a 'multipleResolves' process event that is emitted whenever a Promise is attempted to be resolved multiple times. Updates to url Node.js v10.12.0 adds url.fileURLToPath(url) and url.pathToFileURL(path). These methods can be used to correctly convert between file: URLs and absolute paths. Changes in Utilities The util module is primarily designed to support the needs of Node.js' own internal APIs. The changes in Node.js v10.12.0 include: A new sorted option is added to util.inspect(). If set to true, all properties of an object and Set and Map entries will be sorted in the returned string. If set to a function, it is used as a compare function. The util.instpect.custom symbol is now defined in the global symbol registry as Symbol.for('nodejs.util.inspect.custom'). Support for BigInt numbers in util.format() are also added. Improvements in V8 API The V8 module exposes APIs that are specific to the version of V8 built into the Node.js binary. A number of V8 C++ APIs in v10.12.0 have been marked as deprecated since they have been removed in the upstream repository. Replacement APIs are added where necessary. Changes in Windows The Windows msi installer now provides an option to automatically install the tools required to build native modules. You can find the list of full changes on the Node.js Blog. Node.js and JS Foundation announce intent to merge; developers have mixed feelings. Node.js announces security updates for all their active release lines for August 2018. Deploying Node.js apps on Google App Engine is now easy.
Read more
  • 0
  • 0
  • 4678

article-image-webassembly-comes-to-qt-now-you-can-deploy-your-next-qt-app-in-browser
Kunal Chaudhari
31 May 2018
2 min read
Save for later

WebAssembly comes to Qt. Now you can deploy your next Qt app in browser

Kunal Chaudhari
31 May 2018
2 min read
When Qt 5.11 was released last week, a technology preview of Qt for WebAssembly was released along with it, allowing developers to run Qt applications directly inside the browser window. WebAssembly is a brand-new technology that represents a paradigm shift in web development. Leveraging this technology web developers can write high-performance applications that can run directly in the browser. A common misconception about WebAssembly is that it will eventually replace JavaScript, but the fact is that it’s intended to be used alongside JavaScript. WebAssembly is nothing but a bytecode format which is executed in a web browser. This allows an application to be deployed to a device with a compliant web browser without going through any explicit installation steps. WebAssembly is now supported by all major web browsers as a binary format for allowing executable code in web pages that is nearly as fast as native machine code. Qt uses Emscripten, an open source LLVM to JavaScript compiler. Emscripten complies Qt applications so they can run in a web browser from a web server. Deploying applications on multiple platforms is a tedious task, with WebAssembly developers need to just compile and deploy on a web server for any platform that has a browser. This feature comes in handy especially for enterprise users with multiple clients who are using different platforms. These enterprises can use Qt for WebAssembly to compile their Qt or Quick app and deploy once. Adding support for WebAssembly is a huge step forward for Qt in order to become a truly cross-platform framework. The project is currently in beta and has been released as a technology preview. You can visit the official Qt blog for more information. Qt 5.11 has arrived! How to create multithreaded applications in Qt 3 ways to deploy a QT and OpenCV application
Read more
  • 0
  • 0
  • 4666

article-image-you-can-now-use-webassembly-from-net-with-wasmtime
Vincy Davis
05 Dec 2019
3 min read
Save for later

You can now use WebAssembly from .NET with Wasmtime!

Vincy Davis
05 Dec 2019
3 min read
Two months ago, ASP.NET Core 3.0 was released with an updated version of the Blazor framework. This framework allows the building of interactive client-side web UI with .NET. Yesterday, Peter Huene, a staff research engineer at Mozilla shared his experience of using Wasmtime with .NET. He affirms that using this format will enable developers to programmatically load and execute WebAssembly code directly from their .NET programs. Key benefits of using WebAssembly from .NET with Wasmtime Share more code across platforms Although .NET Core enables cross-platform use, developers find it difficult to use a native library as .Net Core requires native interop and a platform-specific build for each supported platform. However, if the native library is compiled to WebAssembly, then the same WebAssembly module can be used across many different platforms and programming environments, including .NET. Thus a more simplified distribution of the library and applications will allow developers to share more codes across platforms. Securely isolate untrusted code According to Huene, “The .NET Framework attempted to sandbox untrusted code with technologies such as Code Access Security and Application Domains, but ultimately these failed to properly isolate untrusted code.” This resulted in Microsoft deprecating its use for sandboxing and removing it from .NET Core. Huene asserts that since WebAssembly is designed for the web, its module will enable users to call the external explicitly imported function from a host environment and will also give access to only a region of memory given to it by the host. With WebAssembly, users can also leverage this design to sandbox code in a .NET program. Improved interoperability with interface types In August this year, WebAssembly’s interface types permitted users to run WebAssembly with many programming languages like Python, Ruby, and Rust. This interoperability reduced the amount of glue code which was necessary for passing complex types between the hosting application and a WebAssembly module. According to Huene, if Wasmtime implements official support for interface types for .NET API in the future, it will enable a seamless exchange of complex types between WebAssembly and .NET. Users have liked the approach of using WebAssembly from .NET with Wasmtime. https://twitter.com/mattferderer/status/1202276545840197633 https://twitter.com/seangwright/status/1202488332011347968 To know how Peter Huene used WebAssembly from .NET, check out his demonstrations on the Mozilla Hacks blog. Exploring .Net Core 3.0 components with Mark J. Price, a Microsoft specialist .NET Framework API Porting Project concludes with .NET Core 3.0 Wasmer’s first Postgres extension to run WebAssembly is here! Wasmer introduces WebAssembly Interfaces for validating the imports and exports of a Wasm module Introducing SwiftWasm, a tool for compiling Swift to WebAssembly
Read more
  • 0
  • 0
  • 4639
Visually different images

article-image-mozillas-mdn-web-docs-gets-new-react-powered-frontend-which-is-now-in-beta
Bhagyashree R
17 Jul 2019
3 min read
Save for later

Mozilla’s MDN Web Docs gets new React-powered frontend, which is now in Beta

Bhagyashree R
17 Jul 2019
3 min read
On Monday, Kadir Topal, a Senior Product Manager at Mozilla announced that the new React frontend of MDN Web Docs is now in Beta. MDN Web Docs, formerly known as Mozilla Developer Network, is the one-stop for web developer documentation. Mozilla has been working on replacing the jQuery library with React for months now to provide developers a customized MDN experience while still ensuring faster page loading time. MDN has two modes: editing and viewing. While viewing is used by most developers visiting the site, only a small fraction of them use the editing mode. This is why the team broke these two use cases into different domains. You can access the editing mode on wiki.developer.mozilla.org and the viewing mode on beta.developer.mozilla.org. The team plans to decommission beta.developer.mozilla.org after the testing phase is complete. The editing mode will continue to be served by the old frontend wiki.developer.mozilla.org. The discussion on this decision started earlier this year. While many praised it for this move, many felt that as a promoter of web standards it shouldn’t overlook web components for a custom framework. A developer commented on MDN’s GitHub repository, “As a user, I would like to see Mozilla that uses web standards to promote web standards. As a developer, I would like to see Mozilla and their developers using web standards and promote them. I don't need to see the nth React project.” Another developer commented, “The message that the No. 1 resource for Web development is ditching the same Web technologies it advocates, would be as disastrous as that, implicitly claiming a defeat for the Web, hence seppuku in the long term for the platform nobody would care much anymore.” In its support a developer remarked, “At the end of the day, none of us should care what MDN uses - we should care that the devs who have put so much effort into building a resource that has massively contributed to our own education and will continue to do so on a daily basis are productive and happy.” David Flanagan, one of the developers behind this project, affirmed that this decision was purely pragmatic. Flanagan shared that the MDN team is very tiny and they only had occasional help from volunteer contributions. Choosing React for MDN’s frontend may bring more contributors, he believed. He said, “Fundamentally, I'm asking you all to trust us. We're hoping to do great things this year with MDN, and I think that the vast majority of our users will love what we do. Thank you for reading this far, and thank you for your passion about web standards and MDN.” The team is now seeking developers’ feedback on this release. In case of any issue, you can file a bug, reply on Discourse, or also contact Topal on Twitter. Mozilla announces a subscription-based service for providing ad-free content to users Mozilla launches Firefox Preview, an early version of a GeckoView-based Firefox for Android Mozilla makes Firefox 67 “faster than ever” by deprioritizing least commonly used features
Read more
  • 0
  • 0
  • 4639

article-image-uber-introduces-fusion-js-web-development-framework
Sugandha Lahoti
02 Aug 2018
3 min read
Save for later

Uber introduces Fusion.js, a plugin-based web development framework for high performance apps

Sugandha Lahoti
02 Aug 2018
3 min read
Uber has revamped their monolithic framework design with a brand new Fusion.js web framework. This plugin-based open source web framework makes it easy to develop lightweight and high-performing apps. Fusion.js is a JavaScript framework that comes with modern features like hot module reloading, data-aware server-side rendering, and bundle splitting support. It also supports popular libraries like React and Redux. Why was Fusion.js required? Uber has been in the app-development business for quite some time now. With the quickly changing web technologies, they wanted to build a high quality framework with modern features which also kept up with the dynamic nature of their web platform. Specifically, they wanted their new framework to address the following pain points: Complex configuration and required boilerplate of multiple tools needed for server-side rendering, code splitting, and hot module reloading Lack of good abstractions for implementing and sharing features that involve different aspects of server-rendered React applications Tight coupling of code located in different places Testing difficulties arising from side effects and singletons Lack of flexibility of a monolithic framework Fusion.js addresses all of these problems. What are the benefits of using Fusion.js? On top of the benefits of a pre-configured, optimized boilerplate, Fusion.js also provides a flexible plugin-based architecture which makes it appropriate for building single-page applications and web apps that depend on complex service layers to meet quality requirements. Fusion.js applications allow apps to have a single entry point file and it’s possible to reuse code on both the server and browser. The single entry point architecture allows plugin developers to co-locate snippets of code based on the library the code pertains to. Plugins use dependency injection so they can expose well-defined APIs as services to other plugins, and a plugin’s dependencies can easily be mocked during tests. For middleware management, Uber uses Koa, which provides a unit-test friendly context-based API. It has a lightweight abstraction for request lifetime management based on the concept of downstreams and upstreams. Fusion.js provides testing tools for developers to test plugins in addition to supporting modern testing tools such as Jest, Enzyme, and Puppeter. The fusion-test-utils package allows mocking the server itself, making it possible to quickly run integration tests between plugins and mocks. For now, over 60 repositories of Uber are using Fusion.js since its internal release. Next in the roadmap are the addition of more performance optimizations, test-oriented tooling, and better flow support. You can checkout the documentation and Github for further information. Masonite 2.0 released, a Python web development framework Is web development dying? Meet Sapper, a military grade PWA framework inspired by Next.js
Read more
  • 0
  • 0
  • 4638

article-image-brave-launches-its-brave-ads-platform-sharing-70-of-the-ad-revenue-with-its-users
Bhagyashree R
25 Apr 2019
4 min read
Save for later

Brave launches its Brave Ads platform sharing 70% of the ad revenue with its users

Bhagyashree R
25 Apr 2019
4 min read
In January this year, Brave announced that it is previewing its new advertising feature, Brave Ads. It opened this feature to all users of its desktop browser for macOS, Windows, and Linux yesterday. Brave Ads is an opt-in digital advertising feature built with user privacy in mind. https://twitter.com/brave/status/1121081425254473728 Previously, we have seen many pay-to-surf sites, but most of them eventually disappeared because of the dot-com bubble. However, Brendan Eich, the CEO, and co-founder of Brave software is pretty confident about his plan. He said, “With Brave Ads, we are launching a digital ad platform that is the first to protect users’ data rights and to reward them for their attention.” He further adds, “Brave Ads also aims to improve the economics and conversion of the online advertising industry, so that publishers and advertisers can thrive without the intermediaries that collect huge fees and that contribute to web-wide surveillance. Privacy by design and no tracking are integral to our mission to fix the Web and its funding model.” Brave is working with various ad networks and brands to create Brave ads catalog inventory. These catalogs are pushed to available devices on a recurring basis. The ads for these catalogs are supplied by Vice, Home Chef, Ternio BlockCard, MyCrypto, eToro, BuySellAds, TAP Network, AirSwap, Fluidity, and Uphold. How Brave Ads work? Brave is based on Chromium that blocks tracking scripts and other technologies that spy on your online activity. So advertisements are generally not shown by default when one uses the Brave browser. Now, Brave Ads puts users in control by allowing them to decide how many ads they would like to see. It ensures user privacy by doing ad matching directly on the users’ device so that their personal data is not leaked to anyone. Out of the revenue generated by viewing these ads, users will get a 70% share and the remaining 30% will go to Brave. This 70% percent cut is estimated to be about $5 per month according to Eich. Users will be paid with Brave’s bitcoin-style "cryptocurrency” called Basic Attention Tokens (BAT). Users can claim these tokens at the close of every Brave Rewards monthly cycle. To view Brave Ads, users are required to enable Brave Rewards by going to the Brave Rewards “setting” page (brave://rewards/). Those who are already using Brave Rewards will get a notification screen to enable this feature. Once a user opts into Brave Rewards, they are presented with offers in the form of notifications. When users click on these notifications, they will be directed to a full page ad in a new ad tab. Right now, users can auto-contribute their earned rewards to their favorite websites or content creators. The browser will soon allow users to use BAT for premium content and also redeem it for real-world rewards such as hotel stays, restaurant vouchers, and gift cards. It also plans to bring an option that will let users convert their BAT into local fiat currency through exchange partners. Brave Ads have received a very mixed reaction from the users. While some compare its advertising model with that of YouTube, others think that the implementation is unethical. One user on Reddit commented, “This idea is very interesting. It reminds me of how YouTube shares their ad revenue with content creators, and that in turn grows YouTube's network and business...The more one browsed or shared of their data, the more one would get paid. It's simple business.” A skeptical user said, “I'm a fan of Brave's mission, and the browser itself is great (basically Chromium but faster), but the practice of hiding publisher's ads but showing their own, which may or may not end up compensating the publisher, seems fairly unethical.” For more details, check out the official announcement by Brave. Brave introduces Brave Ads that share 70% revenue with users for viewing ads Brave Privacy Browser has a ‘backdoor’ to remotely inject headers in HTTP requests: HackerNews Brave 0.55, ad-blocking browser with 22% faster load time and is generally available and works on Chromium
Read more
  • 0
  • 0
  • 4625
Unlock access to the largest independent learning library in Tech for FREE!
Get unlimited access to 7500+ expert-authored eBooks and video courses covering every tech area you can think of.
Renews at €14.99/month. Cancel anytime
article-image-mozilla-introduces-pyodide-a-python-data-science-stack-compiled-to-webassembly
Bhagyashree R
17 Apr 2019
3 min read
Save for later

Mozilla introduces Pyodide, a Python data science stack compiled to WebAssembly

Bhagyashree R
17 Apr 2019
3 min read
Mozilla is constantly putting its efforts in developing new tools that ease the life of a data scientist. In March this year, it introduced Iodide, an experimental tool to create interactive documents using web technologies. And, yesterday, it has come up with another experimental tool called Pyodide to create a full Python data science stack that runs entirely in the browser. Why Pyodide is introduced? JavaScript, the most popularly-used web language, does not offer a mature suite of data science library. It also lacks a number of features for numerical computing such as operator overloading. Mozilla aims to change this and bring data science-related tools to JavaScript. Additionally, it is also argued that Python’s limitation of not being able to run in the browser can prove to be a threat to the language itself. Mozilla in the blog wrote, “with so much user interaction happening on the web or on mobile devices, it needs to work there or be left behind.” What is Pyodide? Pyodide provides a full, standard Python interpreter, which runs entirely in the browser. It has full access to all the APIs that a browser provides. While it is closely related to the Iodide project, Pyodide can also be used standalone in any context you want to run Python inside a web browser. Here’s an example of what you can do with this tool. This example shows a 3D plot of the density of calls to the City of Oakland, California “311” local information service. Here the data loading and processing is performed in Python. The plotting is taken care off by WebGL, a JavaScript API for rendering 2D and 3D graphics within a compatible web browser. Source: Mozilla For creating Pyodide, the team has used the source code of the mainstream Python interpreter, CPython and the scientific computing packages such as NumPy. They did some small set of changes to make these tools work in the new environment. And, finally, the code was compiled to WebAssembly using Emscripten’s compiler. Pyodide enables you to fetch things over the network using the browser’s APIs and will come with support for threading in the near future. However, there is very less chance that it will ever support features such as low-level networking sockets because of the browser’s security sandbox. Some of the big legends in Python have appreciated this project: https://twitter.com/gvanrossum/status/1118733186253479936 https://twitter.com/pwang/status/1118753387967909888 To know more in detail, check out the official announcement by Mozilla. Mozilla and Google Chrome refuse to support Gab’s Dissenter extension for violating acceptable use policy Mozilla developers have built BugBug which uses machine learning to triage Firefox bugs Mozilla introduces Iodide, a tool for data scientists to create interactive documents using web technologies  
Read more
  • 0
  • 0
  • 4616

article-image-ghost-3-0-an-open-source-headless-node-js-cms-released-with-jamstack-integration-github-actions-and-more
Savia Lobo
23 Oct 2019
4 min read
Save for later

Ghost 3.0, an open-source headless Node.js CMS, released with JAMStack integration, GitHub Actions, and more!

Savia Lobo
23 Oct 2019
4 min read
Yesterday, the team behind Ghost, an open-source headless Node.js CMS, announced its major version, Ghost 3.0. The new version represents “a total of more than 15,000 commits across almost 300 releases”  Ghost is now used by the likes of Apple, DuckDuckGo, OpenAI, The Stanford Review, Mozilla, Cloudflare, Digital Ocean, and many, others. “To date, Ghost has made $5,000,000 in customer revenue whilst maintaining complete independence and giving away 0% of the business,” the official website highlights. https://twitter.com/Ghost/status/1186613938697338881 What’s new in Ghost 3.0? Ghost on the JAMStack The team has revamped the traditional architecture using JAMStack which makes Ghost a completely decoupled headless CMS. In this way, users can generate a static site and later add dynamic features to make it powerful. The new architecture unlocks content management that is fundamentally built via APIs, webhooks, and frameworks to generate robust modern websites. Continuous theme deployments with GitHub Actions The process of manually making a zip, navigating to Ghost Admin, and uploading an update in the browser can be difficult at times. To deploy Ghost themes to production in a better way, the team decided to combine with Github Actions. This makes it easy to continuously sync custom Ghost themes to live production sites with every new commit. New WordPress migration plugin Earlier versions of Ghost included a very basic WordPress migrator plugin that made it extremely difficult for anyone to move their data between the platforms or have a smooth experience. The new Ghost 3.0 compatible WordPress migration plugin provides a single-button-download of the full WordPress content + image archive in a format that can be dragged and dropped into Ghost's importer. Those who are new and want to explore Ghost 3.0 can create a new site in a few clicks with an unrestricted 14 day free trial as all new sites on Ghost (Pro) are running Ghost 3.0. The team expects users to try out Ghost 3.0 and get back with feedback for the team on the Ghost forum or help out on Github for building the next features with the Ghost team. Ben Thompson’s Stratechery, a subscription-based newsletter featuring in-depth commentary on tech and media news, recently posted an interview with Ghost CEO John O’Nolan. This interview features questions on what Ghost is, where it came from, and much more. Ghost 3.0 has received a positive response from many and also the fact that it is moving towards adopting static site JAMStack approach. A user on Hacker News commented, “In my experience, Ghost has been the no-nonsense blog CMS that has been stable and just worked with very little maintenance. I like that they are now moving towards static site JAMStack approach, driven by APIs rather than the current SSR model. This lets anybody to customise their themes with the language / framework of choice and generating static builds that can be cached for improved loading times.” Another user who is using Ghost for the first time commented, “I've never tried Ghost, although their website always appealed to me (one of the best designed website I know). I've been using WordPress for the past 13 years, for personal and also professional projects, which means the familiarity I've built with building custom themes never drew me towards trying another CMS. But going through this blog post announcement, I saw that Ghost can be used as a headless CMS with frontend frameworks. And since I started using GatsbyJS extensively in the past year, it seems like something that would work _really_ well together. Gonna try it out! And congrats on remaining true to your initial philosophy.” To know more about the other features in detail, read the official blog post. Google partners with WordPress and invests $1.2 million on “an opinionated CMS” called Newspack Verizon sells Tumblr to WordPress parent, Automattic, for allegedly less than $3million, a fraction of its acquisition cost FaunaDB brings its serverless database to Netlify to help developers create apps
Read more
  • 0
  • 0
  • 4589

article-image-next-js-9-releases-with-built-in-zero-config-typescript-support-automatic-static-optimization-api-routes-and-more
Vincy Davis
08 Jul 2019
5 min read
Save for later

Next.js 9 releases with built in zero-config TypeScript support, automatic static optimization, API routes and more

Vincy Davis
08 Jul 2019
5 min read
Today an exciting news was awaiting the Next.js users, five months after Next.js 8 was released. Today the Next.js team has released their next version Next.js 9. The major highlights of this release are the built in zero-config TypeScript support, automatic static optimization, API routes and improved developer experience. All the features are backwards compatible with the earlier versions of Next.js. Some of the major features are explained in brief below: Built-In Zero-Config TypeScript Support Automated Setup Getting started with TypeScript in Next.js is easy: rename any file, page or component, from ‘.js’ to ‘.tsx’. Then, run ‘next dev’. Next.js will also create a default ‘tsconfig.json’ with sensible defaults, if not already present. Integrated Type-Checking While in development Next.js will show type errors after saving a file. Type-checking happens in the background, allowing users to interact with the updated application in the browser instantly. Type errors will propagate to the browser as they become available. Next.js will also automatically fail the production build, if type errors are present. This helps prevent shipping broken code to production. Dynamic Route Segments Next.js supports creating routes with basic named parameters, a pattern popularized by ‘path-to-regexp’. Creating a page that matches the route ‘/post/:pid’ can now be achieved by creating a file in your pages directory named: ‘pages/post/[pid].js’. Next.js will automatically match requests like ‘/post/1, /post/hello-nextjs’, etc and render the page defined in ‘pages/post/[pid].js’. The matching URL segment will be passed as a query parameter to your page with the name specified between the ‘[square-brackets]’. Automatic Static Optimization Starting with Next.js 9, users will no longer have to make the choice between fully server-rendering or statically exporting their application. Users can now do both on a per-page basis. Automatic Partial Static Export A heuristic was introduced to automatically determine if a page can be prerendered to static HTML using ‘getInitialProps’. This allows Next.js to emit hybrid applications that contain both server-rendered and statically generated pages. The built-in Next.js server (‘next start’) and programmatic API (‘app.getRequestHandler()’) both support this build output transparently. There is no configuration or special handling required. Statically generated pages are still reactive: Next.js will hydrate the application client-side for full interactivity. Furthermore, Next.js will update the application after hydration also, if the page relies on query parameters in the URL. API Routes To start using API routes, users have to create a directory called ‘api/’ inside the ‘pages/ directory’. All files in this directory will be automatically mapped to ‘/api/<your route>’, in the same way as other page files are mapped to routes. All the files inside the ‘pages/api/’ directory export a request handler function instead of a React Component. Besides using incoming data, the API endpoint will also return data. Next.js will provide ‘res.json()’ by default making it easier to send data. When making changes to API endpoints in development, the user need not restart the server as the code is automatically reloaded. Production Optimizations Prefetching in-Viewport <Link>s Next.js 9 will automatically prefetch <Link> components as they appear in-viewport. This feature improves the responsiveness of users application by making navigations to new pages quicker. Next.js uses an Intersection Observer to prefetch the assets necessary in the background. These requests have low-priority and yield to ‘fetch()’ or XHR requests. Next.js will avoid automatically prefetching if the user has data-saver enabled. Optimized AMP by Default Next.js 9 will render optimized AMP by default. Optimized AMP is up to 50% faster than traditional AMP. Dead Code Elimination for typeof window Branches Next.js 9 replaces ‘typeof window’ with its appropriate value (undefined or object) during server and client builds. This change allows Next.js to remove dead code from compiled code automatically. Developer Experience Improvements Next.js 9 aims to bring unobtrusive and ease-of-use improvements to help its users develop in the best way. Compiling Indicator An RFC / "good first issue" has been created to discuss potential solutions for the problem of indicating that work is being done. Users will also see a small triangle to show that Next.js is doing compilation work, at the bottom right corner of the page. Console Output Starting from Next.js 9, the log output will jump less and will no longer clear the screen. This allows for a better overall experience as the users terminal window will have more relevant information and will flicker less, while Next.js will integrate better. Users are very happy with the striking features introduced in Next.js 9. https://twitter.com/johnbrett_/status/1148167900840255489 https://twitter.com/chanlitohem/status/1148167705834352640 A user on Reddit says that, “That API routes feature looks amazing. Will definitely check it out.” Another Redditor comments, “Gonna give v9 a try today. Very stoked for the new dynamic routing!” Head over to the Next.js official blog for more details. Next.js 7, a framework for server-rendered React applications, releases with support for React context API and Webassembly Meet Sapper, a military grade PWA framework inspired by Next.js 16 JavaScript frameworks developers should learn in 2019
Read more
  • 0
  • 0
  • 4541

article-image-safari-technology-preview-91-gets-beta-support-for-the-webgpu-javascript-api-and-wsl
Bhagyashree R
13 Sep 2019
3 min read
Save for later

Safari Technology Preview 91 gets beta support for the WebGPU JavaScript API and WSL

Bhagyashree R
13 Sep 2019
3 min read
Yesterday, Apple announced that Safari Technology Preview 91 now supports the beta version of the new WebGPU graphics API and its shading language, Web Shading Language (WSL). You can enable the WebGPU beta support by selecting Experimental Features > WebGPU in the Developer menu. The WebGPU JavaScript API WebGPU is a new graphics API for the web that aims to provide "modern 3D graphics and computation capabilities.” It is a successor to WebGL, a JavaScript API that enables 3D and 2D graphics rendering within any compatible browser without the need for a plug-in. It is being developed in the W3C GPU for the Web Community Group with engineers from Apple, Mozilla, Microsoft, Google, and others. Read also: WebGL 2.0: What you need to know Comparing WebGPU and WebGL WebGPU is different from WebGL in the respect that it is not a direct port of any existing native API, but a similarity between the two is that they both are accessed through JavaScript. However, the team does have plans to make it accessible through WebAssembly as well in the future. In WebGL, rendering a single object requires writing a series of state-changing calls. On the other hand, WebGPU combines all the state-changing calls into a single object named pipeline state object. It validates the state after the pipeline is created to prevent expensive state analysis inside the draw call. Also, wrapping an entire pipeline state in a single function call reduces the number of exchanges between Javascript and WebKit’s C++ browser engine. Similarly, resources in WebGL are bound one-by-one, while WebGPU batches them up into bind groups. The team explains, “In both of these examples, multiple objects are gathered up together and baked into a hardware-dependent format, which is when the browser performs validation. Being able to separate object validation from object use means the application author has more control over when expensive operations occur in the lifecycle of their application.” The main focus area of WebGPU is to provide improved performance and ease of use as compared to WebGL. The team compared the performance of the two using the 2D graphics benchmark, MotionMark. The performance test they wrote measured how many triangles each with different properties were rendered while maintaining 60 frames per second. Each triangle was rendered with a different draw call and bind group. WebGPU showed a substantially better performance than WebGL: Source: Apple WHLSL is now renamed to WSL In November last year, Apple proposed a new shading language for WebGPU named Web High-Level Shading Language (WHLSL), which was source-compatible with HLSL. After receiving the community feedback, they updated the language to be compatible with OpenGL Shading Language (GLSL), which is a pretty commonly used language among the web developers. Apple renamed this version of the language to Web Shading Language (WSL) and describes it as “simple, low-level, and fast to compile.” Read also: Introducing Web High Level Shading Language (WHLSL): A graphics shading language for WebGPU “There are many Web developers using GLSL today in WebGL, so a potential browser accepting a different high-level language, like HLSL, wouldn’t suit their needs well. In addition, a high-level language such as HLSL can’t be executed faithfully on every platform and graphics API that WebGPU is designed to execute on,” the team wrote. Check out the official announcement by Apple to know more in detail. Other news in web Firefox 69 allows default blocking of third-party tracking cookies and cryptomining for all users New memory usage optimizations implemented in V8 Lite can also benefit V8 Laravel 6.0 releases with Laravel vapor compatibility, LazyCollection, improved authorization response and more  
Read more
  • 0
  • 0
  • 4536
article-image-react-16-5-0-is-now-out-with-a-new-package-for-scheduling-support-for-devtools-and-more
Bhagyashree R
07 Sep 2018
3 min read
Save for later

React 16.5.0 is now out with a new package for scheduling, support for DevTools, and more!

Bhagyashree R
07 Sep 2018
3 min read
React announced its monthly release yesterday, React 16.5.0. In this release they have improved warning messages, added support for React DevTools Profiler in React DOM, and done some bug fixes. Updates in React A Dev warning is shown if React.forwardRef render function doesn't take exactly two arguments. A more improved message is shown if someone passes an element to createElement by mistake. The onRender function will be called after mutations and commitTime reflects pre-mutation time. Updates in React DOM New additions Support for React DevTools Profiler is added. The react-dom/profiling entry point is added for profiling in production. The onAuxClick event is added for browsers that support it. The movementX and movementY fields are added to mouse events. The tangentialPressure and twist fields are added to pointer events. Support for passing booleans to the focusable SVG attribute. Improvements Improved component stack for the folder/index.js naming convention. Improved warning when using getDerivedStateFromProps without initialized state. Improved invalid textarea usage warning. Electrons <webview> tag are now allowed without warnings. Bug fixes Fixed incorrect data in compositionend event when typing Korean on IE11. Avoid setting empty values on submit and reset buttons. The onSelect event not being triggered after drag and drop. The onClick event not working inside a portal on iOS. A performance issue when thousands of roots are re-rendered. gridArea will be treated as a unitless CSS property. The checked attribute is not getting initially set on the input. A crash when using dynamic children in the option tag. Updates in React DOM Server A crash is fixed that happens during server render in react 16.4.1 Fixes a crash when setTimeout is missing This release fixes a crash with nullish children when using dangerouslySetInnerHtml in a selected option. Updates in React Test Renderer and Test Utils A Jest-specific ReactTestUtils.mockComponent() helper is now deprecated. A warning is shown when a React DOM portal is passed to ReactTestRenderer. Improvements in TestUtils error messages for bad first argument. Updates in React ART Support for DevTools is added New package for scheduling (experimental) The ReactDOMFrameScheduling module will be pulled out in a separate package for cooperatively scheduling work in a browser environment. It's used by React internally, but its public API is not finalized yet. To see the complete list of updates in React 16.5.0, head over to their GitHub repository. React Next React Native 0.57 coming soon with new iOS WebViews Implementing React Component Lifecycle methods [Tutorial] Understanding functional reactive programming in Scala [Tutorial]
Read more
  • 0
  • 0
  • 4491

article-image-former-npm-cto-introduces-entropic-a-federated-package-registry-with-a-new-cli-and-much-more
Amrata Joshi
03 Jun 2019
3 min read
Save for later

Former npm CTO introduces Entropic, a federated package registry with a new CLI and much more!

Amrata Joshi
03 Jun 2019
3 min read
Yesterday, at JSConfEU '19, the team behind Entropic announced Entropic, a federated package registry with a new CLI that works smoothly with the network.  Entropic is also Apache 2 licensed and is federated. It mirrors all packages that users install from the legacy package manager. Entropic offers a new file-centric API and a content-addressable storage system that minimizes the amount of data that should be retrieved over a network. This file-centric approach also applies to the publication API. https://www.youtube.com/watch?v=xdLMbvEc2zk C J Silverio, Principal Engineer at Eaze said during the announcement, “I actually believe in open source despite everything I think it's good for us as human beings to give things away to each other but I think it's important. It's going to be plenty for my work so Chris tickets in news isn't it making out Twitter moment now Christensen and I have the natural we would like to give something away to you all right now.” https://twitter.com/kosamari/status/1134876898604048384 https://twitter.com/i/moments/1135060936216272896 https://twitter.com/colestrode/status/1135320460072296449 Features of Entropic Package specifications All the Entropic packages are namespaced, and a full Entropic package spec includes the hostname of its registry. The package specifications are also fully qualified with a namespace, hostname, and package name. They appear to be: [email protected]/pkg-name. For example, the ds cli is specified by [email protected]/ds. If a user publishes a package to their local registry that depends on packages from other registries, then the local instance will mirror all the packages on which the user’s package depend on. The team aims to keep each instance entirely self-sufficient, so installs aren’t dependent on a resource that might vanish. And the abandoned packages are moved to the abandonware namespace. The packages can be easily updated by any user in the package's namespace and can also have a list of maintainers. The ds cli Entropic requires a new command-line client known as ds or "entropy delta". According to the Entropic team, the cli doesn't have a very sensible shell for running commands yet. Currently, if users want to install packages using ds then they can now run ds build in a directory with a Package.toml to produce a ds/node_modules directory. The GitHub page reads, “This is a temporary situation!” But Entropic appears to be more like an alternative to npm as it seeks to address the limitations of the ownership model of npm.Inc. It aims to shift from centralized ownership to federated ownership, to restore power back to the commons. https://twitter.com/deluxee/status/1135489151627870209 To know more about this news, check out the GitHub page. GitHub announces beta version of GitHub Package Registry, its new package management service npm Inc. announces npm Enterprise, the first management code registry for organizations Using the Registry and xlswriter modules
Read more
  • 0
  • 0
  • 4486

article-image-mozilla-disables-the-by-default-adobe-flash-plugin-support-in-firefox-nightly-69
Bhagyashree R
15 Jan 2019
2 min read
Save for later

Mozilla disables the by default Adobe Flash plugin support in Firefox Nightly 69

Bhagyashree R
15 Jan 2019
2 min read
Yesterday, the Firefox team disabled the Adobe Flash plugin by default in Firefox Nightly 69, which will be eventually deprecated as per Mozilla’s Plugin Roadmap for Firefox. Users can still activate Flash on certain sites if they want to, through the browser settings. Flash support will be completely removed from the consumer versions of Firefox by early 2020. The Firefox Extended Support Release (ESR) will continue to support Flash till its end-of-life in 2020. Why Mozilla has decided to disable Adobe Flash? In recent years, we have seen a huge growth in web open standards like HTML5, WebGL, and WebAssembly. These technologies now come with various capabilities and functionalities for which we used to have plugins. Now, browser vendors prefer to integrate these capabilities directly into browsers and deprecate plugins. Hence, back in 2017, Adobe announced that along with their technology partners, Google, Mozilla, Apple, Microsoft, and Facebook, it is planning to end-of-life Flash. It also added that by the end of 2020, it will stop updating and distributing the Flash Player and encouraged content creators to migrate any of their content which is in Flash format into new open formats. Following this all the five partners announced their plan of action. Apple already did not supported Flash on iPhone, iPad, and iPod. For Mac users, Flash did not come pre-installed since 2010 and it was by default off if users decided to install it. Facebook announced that they are supporting game developers to migrate their Flash games to HTML5. Google will disable Flash by default in Chrome and remove it completely by the end of 2020. Microsoft also announced that they will phase out Flash from Microsoft Edge and Internet Explorer, eventually leading to the removal of Flash from Windows entirely by the end of 2020. Mozilla releases Firefox 64 and Firefox 65 beta Mozilla shares why Firefox 63 supports Web Components Introducing Firefox Sync centered around user privacy
Read more
  • 0
  • 0
  • 4484
article-image-mozilla-announces-final-four-candidates-that-will-replace-its-irc-network
Bhagyashree R
13 Sep 2019
4 min read
Save for later

Mozilla announces final four candidates that will replace its IRC network

Bhagyashree R
13 Sep 2019
4 min read
In April this year, Mozilla announced that it would be shutting down its IRC network stating that it creates “unnecessary barriers to participation in the Mozilla project.” Last week, Mike Hoye, the Engineering Community Manager at Mozilla, shared the four final candidates for Mozilla’s community-facing synchronous messaging system: Mattermost, Matrix/Riot.im, Rocket.Chat, and Slack. Mattermost is a flexible, self-hostable, open-source messaging platform that enables secure team collaboration. Riot.im is an open-source instant messaging client that is based on the federated Matrix protocol. Rocket.Chat is also a free and open-source team chat collaboration platform. The only proprietary option in the shortlisted messaging platform list is Slack, which is a widely used team collaboration hub. Read also: Slack stocks surges 49% on the first trading day on the NYSE after direct public offering Explaining how Mozilla shortlisted these messaging systems, Hoye wrote, “These candidates were assessed on a variety of axes, most importantly Community Participation Guideline enforcement and accessibility, but also including team requirements from engineering, organizational-values alignment, usability, utility and cost.” He said that though there were a whole lot of options to choose from these were the ones that best-suited Mozilla’s current institutional needs and organizational goals. Mozilla will soon be launching official test instances of each of the candidates for open testing. After the one month trial period, the team will be taking feedback in dedicated channels on each of those servers. You can also share your feedback in #synchronicity on IRC.mozilla.org and a forum on Mozilla’s community Discourse instance that the team will be creating soon. Mozilla's timeline for transitioning to the finalized messaging system September 12th to October 9th: Mozilla will be running the proof of concept trials and accepting community feedback. October 9th to 30th: It will discuss the feedback, draft a proposed post-IRC plan, and get approval from the stakeholders. December 1st:  The new messaging system will be started. March 1st, 2020: There will be a transition time for support tooling and developers starting from the launch to March 1st, 2020. After this Mozilla’s IRC network will be shut down. Hoye shared that the internal Slack instance will still be running regardless of the result to ensure smooth communication. He wrote, “Internal Slack is not going away; that has never been on the table. Whatever the outcome of this process, if you work at Mozilla your manager will still need to be able to find you on Slack, and that is where internal discussions and critical incident management will take place.” In a discussion on Hacker News, many rooted for Matrix. A user commented, “I am hoping they go with Matrix, least then I will be able to have the choice of having a client appropriate to my needs.” Another user added, “Man, I sure hope they go the route of Matrix! Between the French government and Mozilla, both potentially using Matrix would send a great and strong signal to the world, that matrix can work for everyone! Fingers crossed!” Many also appreciated that Mozilla chose three open-source messaging systems. A user commented, “It's great to see 3/4 of the options are open source! Whatever happens, I really hope the community gets behind the open-source options and don't let more things get eaten up by commercial silos cough slack cough.” Some were not happy that Zulip, an open-source group chat application, was not selected. “I'm sad to see Zulip excluded from the list. It solves the #1 issue with large group chats - proper threading. Nothing worse than waking up to a 1000 message backlog you have to sort through to filter out the information relevant to you. Except for Slack, all of their other choices have very poor threading,” a user commented. Check out the Hoye’s official announcement to know more in detail. Other news in web Firefox 69 allows default blocking of third-party tracking cookies and cryptomining for all users Wasmer’s first Postgres extension to run WebAssembly is here! JavaScript will soon support optional chaining operator as its ECMAScript proposal reaches stage 3
Read more
  • 0
  • 0
  • 4448

article-image-mozilla-building-bridge-rust-javascript
Richard Gall
10 Apr 2018
2 min read
Save for later

Mozilla is building a bridge between Rust and JavaScript

Richard Gall
10 Apr 2018
2 min read
Mozilla is building a bridge between Rust and JavaScript. The bridge - Wasm-bindgen - allows Rust to interact with Web Assembly modules and JavaScript. One of Mozilla's aims is to turn Rust into a language for web development; building a link to WebAssembly is perhaps the most straightforward way for it to run on the web. But this doesn't mean Mozilla wants Rust to replace JavaScript - far from it. The plan is instead for Rust to be a language that runs alongside JavaScript on the backend. Read more about Mozilla's plan here. What is wasm-bindgen? It's worth reading this from the Mozilla blog to see the logic behind wasm-bidgen and how it's going to work: "Today the WebAssembly specification only defines four types: two integer types and two floating-point types. Most of the time, however, JS and Rust developers are working with much richer types! For example, JS developers often interact with document to add or modify HTML nodes, while Rust developers work with types like Result for error handling, and almost all programmers work with strings. Being limited only to the types that WebAssembly provides today would be far too restrictive, and this is where wasm-bindgen comes into the picture. The goal of wasm-bindgen is to provide a bridge between the types of JS and Rust. It allows JS to call a Rust API with a string, or a Rust function to catch a JS exception. wasm-bindgen erases the impedance mismatch between WebAssembly and JavaScript, ensuring that JavaScript can invoke WebAssembly functions efficiently and without boilerplate, and that WebAssembly can do the same with JavaScript functions." This is exciting as it is a valuable step in expanding the capabilities of Rust. But the thinking behind wasm-bindgen will also help to further drive the adoption of web assembly. While the focus is, of course, on Rust at the moment, there's a possibility that wasm-bindgen could eventually be used with other languages, such as C and C++. This might take some time, owever. Download wasm-bindgen from GitHub.
Read more
  • 0
  • 0
  • 4435