infernojs/inferno-website

Inferno-website

 

 

Installation

npm install

How to run

For development:

npm run dev
# webpack
open http://localhost:8082
# server
open http://localhost:8080

For dev prod:

npm run prod

Deploying

Build:

npm run build

Start:

npm run start
open http://localhost:8050

Deploy:

now

1. we run npm run build
2. this creates the dist directory (and so that we can copy things from src, and public, those sub directories)
3. we copy the code, and run babel on src => dist/src (this is done also when we run now-build using zeit now static build, configured in the now.json
4. dist/src/server.js is run with node

Requirements

Node 8+

Useful links

• Inferno - What this website is all about
• Project structure based on Inferno-starter
• Typescript project setup with ts-transform-inferno can be found here.

TODO

• should not transpile the server in the same way
• can use ts + babel...
• precompile the markdown

inferno-website's Issues

page not found / HTML5 history problems

Maybe it's just me, don't know, but whenever I navigate to a page in the docs section (for example here) and reload the tab (or just reopen the browser) I get a "not found" message - probably the site has no server side renderer/router, would it be possible to switch to hash or hashbang style "legacy" urls? Wouldn't that help? Thanks!

Docs are broken. All text replaced with [object Object]

https://infernojs.org/docs/guides/installation

do not work well

If I open the api page on the left side we can see extra-link but if I click on it there is no action.
I'm using Firefox 59.0.1 64bit on Ubuntu 16.04 desktop

Use latest Inferno version

Inferno now exposes Inferno.version which is version of currently installed module. We could use that number to keep docs up to date with Inferno version.

Website currently is refering to Inferno 1.0.3 Should be 1.1.2 (by the time of writing this issue)

[docs] Document dangerouslySetInnerHTML

Docs don't explain how to ser inner HTML of elements (for example when server rendering).

There should probably be dangerouslySetInnerHTML mentioned somewhere as an aid for this.

Mobile nav

On mobile chrome the nav menu doesn't close after navigating to a new page.

Minify CSS

CSS should be minified and autoprefixed.

• cssnano
• autoprefixer
• autoprefixer flex bugs

If you have built inferno utility please add link and short description about it

There is now utilities section in our website!

https://github.com/infernojs/inferno-website/blob/master/src/docs/guides/utilities.md

You can add the thing you have built for inferno there.
Also send PR to add it to inferno main repository readme.

navbar / sidemenu selected is not working

navbar / sidemenu selected page is not working correctly. It does not change it when view is changed. It should also keep correct page selected after refreshing browser.

Add new section for libraries / addons for Inferno

I have no idea how it should look like, but it would be nice to have section or page on our website to promote some of the libraries community has built for Inferno.

one example here:
infernojs/inferno#880

This way it will be easier to find suitable packages when starting new project, and not to re-invent the wheel if somebody has already done it.

The base JS Fiddle is broken

We need to add defer to the script tag in the HTML-pane:

<script defer src="https://cdn.rawgit.com/trueadm/inferno/master/browser/jsfiddle-integration-babel.js"></script>

https://jsfiddle.net/wt5vL603/

Enable SW, HTTP/2 and HTTPS on production server

When the site goes live we need to be sure that Service Workers, H2 and HTTPS are all enabled.

404 when accessing guide directly

e.g. https://infernojs.org/docs/guides/installation

not sure if this is the right place as it looks like an nginx config issue?

Update examples not to render to document.body

Rendering content should always be done to wrapper element instead of document.body

way too big template size in prod mode

nightwolfz/inferno-starter#36

Docs example styling issue

Having an issue on the REPL section. When you first load the site (in dev mode) the code appears styled properly. However when you refresh it displays the copy only in black. Not sure what's going on here, either a hot reloading issue or perhaps SW?

Alternatives to JSX : createElement content missing

https://github.com/infernojs/inferno-website/blob/master/src/docs/guides/alternatives-to-jsx.md#createelement

Header exists, but no content

Add release section for updates

We could use a release section that lists all the patches pushed in each release. The details can include nods to users who have contributed each push (which we can make apart of our release process).

I'm thinking the page should be simple and could pull from the Github API if there's an easy way to collect the data.

@miketlawrence do you think you can mock this up?

502 Bad Gateway

https://infernojs.org/

Consider showing memory usage from JS Framework Benchmark

Especially with regards to Preact, Inferno performs very well in that benchmark (3.5Mb vs 6.1Mb).
http://www.stefankrause.net/js-frameworks-benchmark7/table.html
I would suggest that we add an optional second dimension to the exisiting bar chart.

https://infernojs.org is down!

This site can’t be reached
infernojs.org refused to connect.
Try:
Checking the connection
Checking the proxy and the firewall
ERR_CONNECTION_REFUSED

Compiler error on frontpage example

I get a "Compiler Error: require is not defined" on your frontpage example.

Perhaps fix it? :)

Does not seem to work with www

While https://infernojs.org/ (no-www) works, https://www.infernojs.org/ currently produces a 404 from Zeit.

Document renderToSnapshot in inferno-test-utils

Hi,
Would the maintainers of the project be interested in a PR documenting the renderToSnapshot found in inferno-test-utils? As someone new to Inferno, updated docs about testing would have saved me several hours.

Thanks,
Andrew

Case studies and examples of Inferno in userland

@mikelawrence and I are planning to create a Tutorials/Examples section. A design is being worked on right now and coding shouldn't take much effort now that 1.0 is released.

[Question]: Link to Incompose (recompose clone)

Hi

I've created a clone of recompose for inferno and thought it could be interesting for some of your users. Maybe in the (functional) component section of your website?

Incompose: https://github.com/zanettin/incompose

If you agree, I could create a PR for this. Just let me know what you think about it.

Change onClick to onclick to correct input speed on Lighthouse

Lighthouse reports Estimated Input Latency: 110.6ms (target: 50ms) with detail: The score above is an estimate of how long your app takes to respond to user input, in milliseconds. There is a 90% probability that a user encounters this amount of latency, or less. 10% of the time a user can expect additional latency. If your score is higher than Lighthouse's target score, users may perceive your app as laggy.

Before launch we'll use events as onclick not onClick. Recent Inferno patch allows you to use linkEvent on both but hasn't landed yet: infernojs/inferno#642

Bring attention to our open collective sponsors

We should include our backers and sponsors from https://opencollective.com/inferno

We could use vuejs.org for inspiration.

Website is down http://infernojs.org/

http://infernojs.org/ is down.

Include release information!

Hi,

It would be nice to have release information in our website!

Maybe we could highlight latest release in the main page and then have separate view for whole release history. Currently the release information is stored in Github and we should fetch it from there, because I don't want to maintain two places.

See: https://github.com/infernojs/inferno/releases?after=v4.0.0-2

Some options:

Option 1: We could load release information from Github, using our server as proxy so it would parse markdown same way as docs, but this would make extra traffic to our server

Option 2: We could load release information from Github and parse the markdown syntax at client. But then we need to include that big chunk of JS to client side.

Option 3: We setup webhooks to Github and preload all releases into some json file on our server and then use it same way as api/docs

Other ideas are also welcome.

Write new articles to post on the blog

It would be nice to keep on updating/maintaining the new blog section on Medium. Article ideas include:

1. What we've learned writing Inferno (dos and donts)
2. Behind the performance of Inferno
3. Future ideas for the project

Getting a 502 Bad Gateway

No content is being displayed as a result of a 502 Bad Gateway response from the api endpoints as seen in the dev console.

Add new release section and version details

We could use a release section that lists all the patches pushed in each release. The details can include nods to users who have contributed each push (which we can make apart of our release process).

I'm thinking the page should be simple and could pull from the Github API if there's an easy way to collect the data.

@miketlawrence do you think you can mock this up?

JS benchmark chart is misleading

The chart is cut of at the left, making the difference seem more extreme than it really is. Ember is not five times slower than inferno in the benchmark but it looks like it is in the chart.

Docs view

Hello everyone!

I saw Dominic's tweet, joined the Slack team and here I am.

I was going to take a crack at the Docs view, unless there is a reason not to. Probably do some rough mocks in Sketch to post on the Slack channel.

Let me know if my time would be better spent on a different view.

Also let me know if we've chosen any specific approach to grids, em/rem/px, etc...

Thanks!

pm2 and browser history fix

I cant run infornojs with pm2 so my apps crash every hours someone has a tips ?
ecosystem.json ?
I got also small trouble of scroll to top on load ...
Thanks in advance

i18n support for website and documentation copy

Hi everyone, we will need support translating the Inferno site and documentation into multiple languages. I can commit to Italian and I think @nightwolfz can handle French, Dutch and Russian apparently.

Website not reachable from Chrome

https://infernojs.org is getting ERR_CONNECTION_REFUSED on Chrome 65 (macOS) and also not reachable with Safari. Mobile Safari refuses and says: “Safari can’t open the page because a secure connection couldn’t be established”

DOES WORK on Firefox 58 (macOS)

I am guessing there is an issue with the SSL certificate.

Share.png image's speedometer only shows moderate speed

The meta image (https://www.infernojs.org/assets/share.png) that gets shared has a different speedometer that shows an inconsistent speed compared to the one on the actual website.

Differences section on homepage and docs

The differences sections need copy on the homepage and Docs sections of the website. Docs also has some linking issues that are making it a bit unusable right now.

There is a ContentAccordion (incorrectly named I might add :p) section for differences between React/Preact and other libraries. We need to add in additional details in these sections (so more of a copywriting task).

Improve REF documentation

Documentation needs to be more beginner friendly, how to use Ref for html elements / components

Add brunch guide

In addition to the new brunch-with-inferno, it would be great to have a new guide for the docs, as requested in this issue.

Will open a pull request as soon as I create the md.

Can not resolve infernojs.org

The infernojs.org website appears to be down and unreachable.

Documentation looks broken in webpage

Try accessing https://infernojs.org/docs/api/inferno

All I see is [Object object][Object object]...

Perf comparison: The Mitrhil vdom-benchmark score is 2 years out of date

See https://cdn.rawgit.com/pygy/vdom-benchmark-mithril/87d3c48aca722ed24a62b31ca48639a82c413022/index.html for v1.1.1 which is 2-3 times slower than Inferno, depending on the browser used, not 6 or 10 times like v0.2.0.

(paste the above url in the "custom" field in https://vdom-benchmark.github.io/vdom-benchmark/)

Error in documentation

I have tested every link in inferno documentation and the same error happened it.

Site:https://infernojs.org/docs/guides/event-handling

i18n support

Hi everyone, we will need support translating the Inferno site and documentation into multiple languages. I can commit to Italian and I think @nightwolfz can handle French, Dutch and Russian apparently.

Yarn run dev Failed

Hello I am trying to install inferno but I got with v7.10.1 OS X NVM

`ERROR in ./src/assets/css/index.scss
Module build failed: ModuleBuildError: Module build failed:
@import "../../../../node_modules/bootstrap/scss/normalize";

  File to import not found or unreadable: ../../../../node_modules/bootstrap/scss/normalize.

Parent style sheet: /Users/insidebox/Documents/GitHub/inferno-website/src/assets/css/modules/_common.scss
in /Users/insidebox/Documents/GitHub/inferno-website/src/assets/css/modules/_common.scss (line 1, column 1)
at runLoaders (/Users/insidebox/Documents/GitHub/inferno-website/node_modules/webpack/lib/NormalModule.js:194:19)
at /Users/insidebox/Documents/GitHub/inferno-website/node_modules/loader-runner/lib/LoaderRunner.js:364:11
at /Users/insidebox/Documents/GitHub/inferno-website/node_modules/loader-runner/lib/LoaderRunner.js:230:18
at context.callback (/Users/insidebox/Documents/GitHub/inferno-website/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
at Object.asyncSassJobQueue.push [as callback] (/Users/insidebox/Documents/GitHub/inferno-website/node_modules/sass-loader/lib/loader.js:55:13)
at Object. (/Users/insidebox/Documents/GitHub/inferno-website/node_modules/async/dist/async.js:2244:31)
at Object.callback (/Users/insidebox/Documents/GitHub/inferno-website/node_modules/async/dist/async.js:906:16)
at options.error (/Users/insidebox/Documents/GitHub/inferno-website/node_modules/node-sass/lib/index.js:294:32)
@ ./src/client.js 9:0-34
@ multi webpack-dev-server/client?http://localhost:8082 webpack/hot/only-dev-server ./core/polyfills.js ./src/client.js

ERROR in ./src/assets/css/index.scss
Module build failed: ModuleBuildError: Module build failed:
@import "../../../../node_modules/bootstrap/scss/normalize";
^
File to import not found or unreadable: ../../../../node_modules/bootstrap/scss/normalize.
Parent style sheet: /Users/insidebox/Documents/GitHub/inferno-website/src/assets/css/modules/_common.scss
in /Users/insidebox/Documents/GitHub/inferno-website/src/assets/css/modules/_common.scss (line 1, column 1)
at runLoaders (/Users/insidebox/Documents/GitHub/inferno-website/node_modules/webpack/lib/NormalModule.js:194:19)
at /Users/insidebox/Documents/GitHub/inferno-website/node_modules/loader-runner/lib/LoaderRunner.js:364:11
at /Users/insidebox/Documents/GitHub/inferno-website/node_modules/loader-runner/lib/LoaderRunner.js:230:18
at context.callback (/Users/insidebox/Documents/GitHub/inferno-website/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
at Object.asyncSassJobQueue.push [as callback] (/Users/insidebox/Documents/GitHub/inferno-website/node_modules/sass-loader/lib/loader.js:55:13)
at Object. (/Users/insidebox/Documents/GitHub/inferno-website/node_modules/async/dist/async.js:2244:31)
at Object.callback (/Users/insidebox/Documents/GitHub/inferno-website/node_modules/async/dist/async.js:906:16)
at options.error (/Users/insidebox/Documents/GitHub/inferno-website/node_modules/node-sass/lib/index.js:294:32)`

And with the latest LTS
yarn install v0.27.5 warning ../../../package.json: No license field info No lockfile found. [1/4] Resolving packages... [2/4] Fetching packages... error [email protected]: The engine "node" is incompatible with this module. Expected version ">= 7.6.0". error Found incompatible module info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.

Thanks

Proper code syntax highlighting

Docs don't seem to property highlight syntax on code examples. You have included Prism's CSS code but something is missing (I believe is JS that must also be included ?! not really sure).

I thought I would open a PR but maybe you have something else on mind. I would be happy to open one though.

Hydration issue between server and client

I just updated the Getting Started link on the homepage to the docs at URL http://localhost:8080/docs/guides/getting-started.md. When testing the link I noticed that hitting the page threw an error:

Uncaught Error: Inferno Error: failed to hydrate. The server-side render doesn't match client side.

Seems like a potential inferno-server issue but cannot confirm right now.