cefsharp / CefSharp

.NET (WPF and Windows Forms) bindings for the Chromium Embedded Framework
http://cefsharp.github.io/
Other
9.84k stars 2.92k forks source link

Improving the website #1421

Closed robinrodricks closed 8 years ago

robinrodricks commented 8 years ago

I'm interesting in creating something like this (https://github.com/MaxDidIt/firetype) or this (http://gamua.com/starling/features/) for CefSharp since its a great project. I'll be adding code examples (if you wish) into the markdown file, but first I need to know/discuss the major features of the project, for the titles of the document. Pictures I will be creating in a graphics app or grabbing screenshots.

Possible content... will be expanding/correcting during discussion....


Full Web Browser in your C# App

CefSharp is the the easiest way to embed a full-featured standards-complaint web browser into your C# or VB.NET app. CefSharp has browser controls for WinForms and WPF apps, and a headless (offscreen) version for automation projects too. CefSharp is based on Chromium, the open source version of Google Chrome. We have a simple 5 step process to get started. See the Quick Start guide and the FAQ.

HTML5, JavaScript and PDF supported

CefSharp embraces modern web standards, and supports HTML5, JavaScript, CSS3 and HTML5 audio/video elements. 3D content is supported via WebGL which uses OpenGL/DirectX for hardware accelerated rendering. CefSharp includes embedded modules for PDF, web page printing and the WebKit Inspector (developer tools). CefSharp has no external dependencies, and the full build of CefSharp only adds ~70 MB to your app. See the Outputs Table for redistribution details.

Deep Integration

You can access and manipulate on-page content using the .NET to JavaScript bridge. You can programmatically execute and embed JavaScript into pages, and receive callbacks when JavaScript events fire. You can use CefSharp to display embedded UI built with HTML5, or to display remote web content and web applications. See the Examples folder for ready-to-compile example apps built with CefSharp.

Warp-drive Performance

Leverage the slick Chromium web browser for a buttery-smooth user experience. CefSharp outperforms every other C# web browser control, including GeckoFX, OpenWebkitSharp, WebKit.NET and Awesomium. CefSharp initializes in <10 ms, and web pages are displayed as they load (progressive rendering). See the Cage Match performance comparison for detailed benchmarks.

Free and Open Source

CefSharp is a .NET wrapper around the fantastic CEF project (Chromium Embedded Framework). And we provide full source code in C# and C++/CLI. You can use the code to hack, improve, fork or simply debug your applications better. If CefSharp helped you, consider making a donation. See Donations for more info.

ray007 commented 8 years ago

You mention hardware accelerated rendering, maybe also say "not in WPF".

amaitland commented 8 years ago

CefSharp has browser controls for WinForms and WPF apps.

There is a third, the OffScreen option which technically isn't a browser control, it should be mentioned though.

CefSharp is based on Chromium, the open source version of Google Chrome.

Based on CEF rather than Chromium?

We have a simple 5 step process to get started. See the Quick Start guide and the FAQ.

Which guide are you referring?

CefSharp embraces modern web standards, and supports HTML5, JavaScript, CSS3 and HTML5 audio/video elements.

CEF really is the hero of the show, CefSharp just provides a convenient .Net wrapper, so I think it's important that people are aware of that.

CefSharp has no external dependencies, and the full build of CefSharp only adds 70 MB to your app.

Is that for the 32bit version? What about the 64bit?

You can access and manipulate on-page content using the C# to JavaScript bridge

.Net to Javascript?

CefSharp outperforms every other C# web browser control,

Should probably say through the power of CEF

If CefSharp helped you, consider making a donation. See Donations for more info.

Prob best to remove this part as there is no donations page.

If you create your changes as a PR then they can be merged in when complete :+1:

amaitland commented 8 years ago

You mention hardware accelerated rendering, maybe also say "not in WPF".

The OSR implementation does provide hardware acceleration, it's just not as well supported as the standard rendering approach and doesn't work on all hardware. So it technically works in WPF in some scenarios. I'm all for putting a caveat about not working on all hardware/platforms though :+1:

robinrodricks commented 8 years ago

Thanks for all the points. I hoped to expand the content I wrote. What I wrote was just a sample! ... And yes, I understand that CEF is responsible for everything, but if Windows was advertised as "Thanks to MS-DOS, MS Windows allows you to do XYZ", it would get very confusing for consumers. Similarly, I think CEF can be mentioned in the end as credits. CefSharp is a great project and deserves to praise its own tail a bit. Is that okay with you?

Based on CEF rather than Chromium?

No. It must say based on Chromium, and later we can say that its a wrapper around CEF.

Which guide are you referring?

I will be making a Quick Start guide, you know, for newbies.

Is that for the 32bit version? What about the 64bit?

Yes. The x64 version shows the same size. Tell me what the size is, if I'm wrong.

Prob best to remove this part as there is no donations page.

Can't you create a donations page? It would def make the project look better.

And lastly, PLEASE SUGGEST MORE TITLES! for more sections! so I can get a nice fleshed out guide rather than just a tiny thing (I think its tiny as of now)

When everyone is happy with the content I'll do some graphics (one pic per point, nice huh?).

robinrodricks commented 8 years ago

Check this out:

http://hgupta9.github.io/CefSharp/

amaitland commented 8 years ago

Thanks for all the points. I hoped to expand the content I wrote. What I wrote was just a sample! ... And yes, I understand that CEF is responsible for everything, but if Windows was advertised as "Thanks to MS-DOS, MS Windows allows you to do XYZ", it would get very confusing for consumers. Similarly, I think CEF can be mentioned in the end as credits. CefSharp is a great project and deserves to praise its own tail a bit. Is that okay with you?

Maybe see what others have to say, I'm happy to be overruled. @jankurianski @jornh Any comments?

No. It must say based on Chromium, and later we can say that its a wrapper around CEF.

When I say CEF i actually mean Chromium Embedded Project.

I will be making a Quick Start guide, you know, for newbies.

Ok cool :+1:

Yes. The x64 version shows the same size. Tell me what the size is, if I'm wrong.

The x64 version of libcef.dll is usually 10+mb bigger than the x86 version, are you sure they're the same?

amaitland commented 8 years ago

Check this out:

http://hgupta9.github.io/CefSharp/

Looks promising :+1:

robinrodricks commented 8 years ago

Check this out: (obviously logo is interim, and is only a placeholder for pics)

http://hgupta9.github.io/CefsharpSite/

jankurianski commented 8 years ago

I think the new phrasing CefSharp is based on Chromium Embedded Framework, the open source version of Google Chrome. is better because it gives credit to both Chromium and CEF. However it isn't technically accurate: Chromium is the open-source version of Google Chrome, CEF is a project that allows Chromium to be embedded within third-party apps.

Here is a more technically accurate statement, but it doesn't read very well: CefSharp is based on the Chromium Embedded Framework (CEF). CEF is a library that allows anyone to embed Chromium - the open-source version of Google Chrome - in their app.

jankurianski commented 8 years ago

BTW @hgupta9 the work on enhancing the website and docs is much appreciated :+1: :smile:

robinrodricks commented 8 years ago

@jankurianski Thank you for your kind comments. I'll see what I can do.

PLEASE SUGGEST MORE TITLES! for more sections! on the website! .. so I can get a nice fleshed out guide .... currently its quite small .. just 5-6 sections.

And the last section ("Documentary") is a drop-in and I don't really know what I'm trying to say... please suggest improvements for it.

robinrodricks commented 8 years ago

See the new quick start:

https://github.com/cefsharp/CefSharp/wiki/Quick-Start

Yes, yes, its the old copy-paste method. I'll cover the NuGet method next. And if anyone thinks its written "for dummies", I can omit some of the steps (create a new VS project, etc)

And my code snippet might be strange, but I don't know how to add the browser component using the VS Toolbox... so I did it entirely in code.

robinrodricks commented 8 years ago

@amaitland @jankurianski @shirotzu - Any ideas?

amaitland commented 8 years ago

Yes, yes, its the old copy-paste method. I'll cover the NuGet method next. And if anyone thinks its written "for dummies", I can omit some of the steps (create a new VS project, etc)

CefSharp currently only provides binaries through Nuget, so it's the default and really only supported method of installing. So I would prefer the Nuget approach be the one we advocate. For those that compile from source I also reccomend they using the build.ps1 script to generate Nuget packages for use offline. https://docs.nuget.org/create/hosting-your-own-nuget-feeds

And my code snippet might be strange, but I don't know how to add the browser component using the VS Toolbox... so I did it entirely in code.

There is no Toolbox support, one of the downsides of CefSharp being a mixed assembly, VS doesn't handle the unmanaged dependency resolution.

Might be worth checking out http://www.codeguru.com/columns/dotnet/if-you-like-it-put-an-html5-ui-on-it.html as a point of reference.

robinrodricks commented 8 years ago

@amaitland - Some questions

  1. Which NuGet method to document? The cmd line or VS plugin?
  2. When to call Cef.Shutdown in the "quick start" example app?
amaitland commented 8 years ago

Which NuGet method to document? The cmd line or VS plugin?

The VS extension would be the most used I would have though? In general I wouldn't spent too much time on the Nuget part it's self, their documentation can easily be linked to.

http://docs.nuget.org/Consume/Package-Manager-Dialog http://docs.nuget.org/Consume/Package-Manager-Console

When to call Cef.Shutdown in the "quick start" example app?

Should be safe to leave out, the framework will call Cef.Shutdown for you and that will be fine for a basic scenario.

amaitland commented 8 years ago

We should probably link to the MinimalExample project, people can see the Nuget packages in action

https://github.com/cefsharp/CefSharp.MinimalExample

robinrodricks commented 8 years ago

@amaitland - Please checkout the logo and gimme feedback about that too. I would like to wrap it up.

amaitland commented 8 years ago

I will reply when I get a second. In the mean time feel free to take a look at the up for grabs issues.

https://github.com/cefsharp/CefSharp/labels/up-for-grabs

If you feel like cutting some code, then there's always lots to be done :+1:

amaitland commented 8 years ago

@hgupta9 I have updated the Quick Start to reference the Nuget based tutorials that already exist. I'm not happy with recommending the Copy and Paste method. When you finish your Nuget based tutorial please add it to the page.

robinrodricks commented 8 years ago

@amaitland Instead of deleting the quick start why couldnt you take 5 mins to modify it for the Nuget steps? I don't use Nuget personally so I'm not familiar with that. I don't understand why you treat new contributors with such disdain .. it only drives them away. Personally I feel much less willing to contribute to this project simply because of how I am received.

If something I have done is not up to the mark, improve it. Or at least, list down the Nuget steps here so I can modify my tutorials... including VS project options... because I went through the following tutorial and found it quite complicated.

http://www.codeproject.com/Articles/881315/Display-HTML-in-WPF-and-CefSharp-Tutorial-Part

Also, you do not cover the offline dev situation. In India, internet connectivity is quite poor and there are a number of corporate situations where devs must work offline. IN THAT CASE MY TUTORIAL IS STILL USEFUL. Only devs who are online can use the Nuget method.

amaitland commented 8 years ago

@amaitland Instead of deleting the quick start why couldnt you take 5 mins to modify it for the Nuget steps?

@hgupta9 I have limited time at the moment and that's the quickest option. My main priority was to finalize the 45.0.0 release. Updating the article would take more than 5 mins. Your work is not lost, as with everything on GitHub there are versions. It's available at https://github.com/cefsharp/CefSharp/wiki/Quick-Start/ec81b8a3782c0264ab234703281174756e18929e

I don't understand why you treat new contributors with such disdain .. it only drives them away.

If something isn't quite as I think it should be then I'm not going to hold back in saying so. I spend a lot of time answering questions in relation to the project and am wary of the advice that's given to others, specially as official Guidance. I think your article is likely to generate more support problems than it addresses, copying dependencies by hand is less than ideal. This is my professional opinion, nothing personal. Is that the best possible advice we can give to novice programmers?

Personally I feel much less willing to contribute to this project simply because of how I am received.

Totally understand that. Three or four of my original Pull Requests were torn to shreds, and rightly so. If this isn't for you then that's obviously your choice.

http://www.codeproject.com/Articles/881315/Display-HTML-in-WPF-and-CefSharp-Tutorial-Part

I have no doubt that can also be improved upon. To me it's not too bad, I can skim over the content, look at the pictures and get enough of an idea of what I'm doing. I do use Nuget all the time. I don't believe we should be reinventing the wheel when it comes to general guidance, if you need to know more about Nuget, then read a specific tutorial. I prefer to keep the scope of the project contained.

At the end of the day this project is for programmers, writing high quality code is more important to me than being nice :smile:

robinrodricks commented 8 years ago

Your points make sense. I understand providing support is a full time job. I'll see how to change for Nuget.

robinrodricks commented 8 years ago

@amaitland - See if my nuget section is sufficient?

www.codeproject.com/Articles/1058700/Embedding-Chrome-in-your-Csharp-App-using-CefSharp

amaitland commented 8 years ago

I will have a look in detail sometime next week.

robinrodricks commented 8 years ago

@amaitland @jankurianski @shirotzu

Great news! The first version of the CefSharp website is up! Take a look and let me know your thoughts. http://hgupta9.github.io/CefsharpSite/

Suggest some content/links to add to the Documentation section at the end.

All diagrams were drawn with Balamiq Mockups. I can release the source files but they are somewhat messy .. since I wasn't aware of the "auto save" feature which messed up my files.

jankurianski commented 8 years ago

Cool, I think it looks pretty good. Some minor points:

amaitland commented 8 years ago

Should we perhaps first direct people to donate to CEF (http://www.magpcss.org/ceforum/donate.php)?

Excellent idea :+1:

robinrodricks commented 8 years ago

@jankurianski - Numerous links added and redirected to CEF for donations. Enough for you? The nuget icon looks okay to me, I'll fix the quick start icon when I get time.

@amaitland - Are you happy with this and would you set it up as the official CefSharp site? I'll tell you how. I'll keep making improvements that can be pulled into the main repo.

amaitland commented 8 years ago

@hgupta9 If you create a PR against the cefsharp.github.io repository we can start the process of getting it updated. I wouldn't say it's ready just yet, it's a start though :+1:

https://github.com/cefsharp/cefsharp.github.io

jankurianski commented 8 years ago

Much better, thanks @hgupta9 :smile:

robinrodricks commented 8 years ago

@amaitland - Its a "start"? I've spent almost a week designing it and that's all the thanks I get? I'm willing to help, but just lend me some appreciation, dude. It doesn't cost anything, you know.

Anyways, what is missing for it to be "ready" according to your standards? Sitemap Footer? Social media buttons? A better theme? HTML5 with mobile support?

BTW, I didn't know this thing existed.. I assume most if it is already in the FAQ? http://rawgit.com/cefsharp/CefSharp/master/CefSharp.Example/Resources/Home.html

amaitland commented 8 years ago

I've spent almost a week designing it for free and that's all the thanks I get?

I've spent the last 18 months maintaining this project for free.

Anyways, what is missing for it to be "ready" according to your standards? Sitemap Footer? Social media buttons? What else do you need on the page?

Just a lot of little things I'd like to see clarified. Nothing major, once there's a PR in place I'll submit my proposed changes.

https://github.com/cefsharp/CefSharp/labels/up-for-grabs https://github.com/cefsharp/CefSharp/labels/feature-request

BTW, I didn't know this thing existed: http://rawgit.com/cefsharp/CefSharp/master/CefSharp.Example/Resources/Home.html

The WinForms and WPF projects use that as their default starting page.

robinrodricks commented 8 years ago

I've spent the last 18 months maintaining this project for free.

Well, sorry about that. I guess "free work" is the essence of FOSS.

I've added a PR; What is the "process of getting it updated" that you are going to follow at this stage? https://github.com/cefsharp/cefsharp.github.io/pull/3

It would really lift spirits if you could accept the PR then I'll work on the changes. Unless you want to wait.

And about your points:

amaitland commented 8 years ago

License - Okay.

https://opensource.org/licenses/BSD-3-Clause

Docs - I repeatedly asked people to suggest extensions. No one did. And I have no clue The wiki seems like a mess

The Wiki is somewhat of a mess, needs a good cleanup which requires time I just don't have at the moment. Some of the pages are probably better removed as their content is inaccurate (or at least put a disclaimer at the top saying their outdated).

Don't exist - What specifically?

  • See the Cage Match performance comparison for detailed benchmarks.
  • Documentation link doesn't go anywhere yet.

.NET - do you know which version you build for?

https://github.com/cefsharp/CefSharp#version-branches

The project it's self requires .Net 4.0, the Examples have been upgraded to 4.5. The 45.0.0 release has upgraded to VC++ 2013, all other versions used VC++ 2012

Contributing - What do you want here?

I think something simple to start with, maybe just mention that anyone with a GitHub account can help improve the Wiki, people looking for coding tasks can check the Feature Requests and Up For Grabs tags.

I'll create a PR towards the cefsharp.github.io repository later this week with my proposed changes.

robinrodricks commented 8 years ago

Documentation link doesn't go anywhere yet

Do you have auto generated docs? I was planning on linking to those.

I'll create a PR towards the cefsharp.github.io repository

Many of your changes have already been completed, and can be seen here:

http://hgupta9.github.io/CefsharpSite/

amaitland commented 8 years ago

Do you have auto generated docs? I was planning on linking to those.

Nope. None exist.

robinrodricks commented 8 years ago

Please merge this. It implements many of your changes.

https://github.com/cefsharp/cefsharp.github.io/pull/4

Preview here (scroll to the bottom) : http://hgupta9.github.io/CefsharpSite/

robinrodricks commented 8 years ago

@amaitland @jankurianski @shirotzu I've made a big update to the website. Please see if its okay.

http://hgupta9.github.io/CefsharpSite/

I've submitted this as PR6 : https://github.com/cefsharp/cefsharp.github.io/pull/6

amaitland commented 8 years ago

Great, thanks :+1: Will have a closer look in the next couple of days.

robinrodricks commented 8 years ago

@amaitland - Can you please accept these PRs

amaitland commented 8 years ago

We're moving towards using Gitter Chat. Continue followup discussion there.