loading...

8th edition of js13kGames, native lazy-loading and GitHub actions with CI/CD | Front End News #13

adriansandu profile image Adrian Sandu Originally published at Medium on ・6 min read

View on YouTube at https://youtu.be/3ixB9qqjjPI

Hello everyone and welcome to another round of Front-End News. Today I’ve got the following main topics:

  • Get ready for the eighth edition of js13kGames
  • Chrome 76 introduces native lazy-loading for images and iframes
  • GitHub Actions now supports CI/CD (continuous integration, delivery and/or deployment)
  • CodePen offers new build process for exported pens

I also have some software updates to mention and a brand new Developer Of The Week. So stay with me until the end to find out all the details.

As always, I have also prepared a video version for those that prefer listening instead of reading. If you enjoy this format, I would appreciate it if you would subscribe to the YouTube channel as well.

Eighth annual js13kGames challenge

Js13kGames is a JavaScript coding competition for HTML5 Game Developers and the eighth edition is nearly upon us. As the name says, the challenge is to create a functional game, only using web technologies, where the final code, compressed in a .zip archive takes less than 13kB of space.

The event starts on August 13th, at 13:00 CEST (11:00 GMT), when the theme for this edition will be announced on the official website. The participants have one month to code their entries and the deadline for submitting the projects is September 13th, at 13:00 CEST (11:00 GMT). The judging process will last for three more weeks, and the winners will be announced on October 5th.

The games can be submitted to any or even all of the following categories: Desktop, Mobile, Server, Web Monetization and WebXR. The full set of rules is available on the event’s website, as well as the winners of previous editions.

Therefore, if HTML5 game development is one of your passions, make sure to check js13kgames.com on August 13 to find the theme of this year’s edition. Good luck and happy coding!

Native lazy-loading for the web

I talked about Chrome 76 in the previous episode. Meanwhile, the Chrome Developer team published a new article on their blog about native lazy loading, a feature they packed in that update.

This new feature is activated using the loading attribute, which has three possible values:

  • auto: toggles the default behavior of the browser, which is the same as not including the attribute at all.
  • lazy: defers loading of the resource until it reaches a calculated distance from the viewport.
  • eager: the resource is loaded immediately, regardless of where it’s located on the page.

Developers will now be able to take advantage of the new loading attribute and test for its support. This way they can use the new native method or fall back to one of the existing alternatives.

More details about the functionality can be found in the official blog post on the Google Developer Blog.

GitHub Actions now supports CI/CD

A year ago GitHub was introducing a beta program for Actions, an API for automating workflows. The package has just been enhanced recently by adding support for continuous integration, delivery and/or deployment. This brings new features like matrix builds, live logs or multi-container testing.

At the moment Actions are free for all participants. Once the beta program ends in November, public repositories will remain free, while private repositories will be subject to a pay-as-you-go system.

Future plans include the addition of self-hosted runners and bringing Actions to GitHub Enterprise Server. More details are available on the official blog and the Actions home page.

CodePen offers new build process for exported pens

CodePen has been allowing users to export their pens for a long time already. If you are a PRO subscriber, you can now continue updating your pre-processor code out of the exported package.

This is not quite an offline mode for CodePen, as the export process is one-way only so far and there are a number of limitations, but it’s as close as you can get at the moment. There is full documentation available and even a podcast episode explaining the new feature in detail.

Software updates and releases

Another week, another list of software update and releases. As usual, there are links to the release notes of each package.

Node v12.8.0

NodeJS got another version bump, this time to v12.8.0.

React v16.9.0

React 16.9 was released, together with an update to the product roadmap. While the Hooks update was done according to the schedule, the inclusion of Concurrent Mode and Suspense for Data Fetching has been delayed. They will be bundled in a single release, planned for the end of the year.

Commander.js v3.0.0

Commander.js is a complete solution for node.js command-line interfaces. A new major update was released recently, bringing the current version to 3.0.0.

Visual Studio Code v1.37

The popular code editor from Microsoft just received its June update (v1.37). The list of changes is quite extensive and it includes an updated set of icons, improvements to the user experience for terminal search and remote development tutorials, to name just a few. For full details please check the official release notes.

The developer of the Week

Today the #DeveloperOfTheWeek title goes to Henry Zhu. He is the main maintainer behind Babel, a tool that allows developers to use the latest advances in JavaScript while maintaining backward compatibility. Being one of the most common dependencies, chances are you are using Babel one way or another, even without knowing.

Henry dedicates most of his time to the maintenance of Babel and shares his experiences on his blog, on Twitter and on two podcasts that discuss the lives of maintainers, “Hope in Source” and “Maintainers Anonymous”.

When GitHub launched the sponsor program, they also started a series of posts sharing the stories of several open-source contributors. One such article was dedicated to Henry and it brings a lot of insight into his story, his journey as a developer and maintainer and his plans for the future.

If you or your organization make use of Babel in any way, or if you share the same ideals on open source software development, then do consider sponsoring Henry on GitHub and allow him to continue his work.

Thank you, Henry, for being awesome and keep up the good work.

Question of the Day

Who is the person that you would like to see mentioned as the next “Developer of the Week”? Please leave your recommendations in the comment section or on https://twitter.com/frontendnexus.

That’s all there is in this edition. Follow Front End Nexus on Twitter at https://twitter.com/frontendnexus to be notified as soon as a new update happens. I also want to encourage you to subscribe to the YouTube channel at https://www.youtube.com/channel/UCgACtqiDmnSaskDIBsK54ww. I can unlock some more options once the channel hits 100 subscribers, so your support is highly appreciated.

Have a great and productive week and I will see you next time!


Posted on by:

adriansandu profile

Adrian Sandu

@adriansandu

I am a UX Front-End Developer, consultant, creator and speaker currently living in Iasi, Romania.

Discussion

pic
Editor guide