Talk about webPack loading on demand

For websites that use single-page applications as front-end architectures, there is a large amount of code that needs to be loaded on a web page, because many functions are concentrated in a single HTML. This leads to slow loading, sluggish interactions, and a poor user experience. The root cause of this problem is that the code for all the features is loaded at once, but the user is only likely to use some of the features at each stage. So the solution to the above problem is to load only the code corresponding to the function that the user currently needs, which is called on-demand loading.

When optimizing on demand for a single page application, the following principles are generally applied:

  • Divide the entire site into small features and then divide them into categories according to how relevant each feature is.
  • Each category is merged into a Chunk and the corresponding Chunk is loaded on demand.
  • Instead of loading the features that users need to see when they first open your site, place them in the Chunk where the portal is to reduce the perceived load time of the page.
  • For individual function points that depend on a large amount of code, such as those that rely on chart.js to draw a Chart and flv.js to play a video, they can be loaded on demand.

The load of the segmented code needs to be triggered at a certain time, that is, when the user has operated or is about to operate on the corresponding function to load the corresponding code. The timing of the load of the split code needs to be measured and determined by the developer based on the requirements of the web page.

Since code that is split off for on-demand loading also takes time to load, you can predict what the user is likely to do next and load the code ahead of time so that the user is unaware of the network load time.

The above is a brief introduction to webPack loading on demand, and is referenced from the article “WebPack Study Notes — Loading on Demand”.

Webpack packaging and compression practices

First, create a new folder webpack-demo, enter the file in the directory line, and use NPM init -y to build a project. Install the following toolkits:

npm i webpack webpack-cli mini-css-extract-plugin css-loader
Copy the code

Completed as shown in the figure below:

You can then create a new webpack.config.js file in the root directory of your folder and write the WebPack configuration items as follows:

const path = require('path')
const MiniCssExtractPlugin = require("mini-css-extract-plugin");

module.exports = {
  mode: 'development'.// Environment mode
  devtool: "source-map".entry: path.resolve(__dirname, './main.js'), // Pack the entry
  output: {
    path: path.resolve(__dirname, 'dist'), // Packaging for export
    filename: 'js/[name].js' // The file name of the packaged static resource
  },
  module: {
    rules: [{test: /\.css$/,
        use: [
          MiniCssExtractPlugin.loader,
          "css-loader"]]}},plugins: [
    new MiniCssExtractPlugin({
      filename: "[name].css",}})]Copy the code

We haven’t written the entry yet, so again create a new main.js directory in the root directory and introduce four CSS files, as shown below:

The content of the CSS file is given a symbolic style:

.a {
  font-size: 12px;
}
Copy the code
.b {
  color: #fff;
}
Copy the code
.c {
  background-color: red;
}
Copy the code
.d {
  padding: 10px;
}
Copy the code

The final step is to add the script directive to package.json, as shown below:

{
  "name": "webpack-demo"."version": "1.0.0"."description": ""."main": "index.js"."scripts": {
    "dev": "webpack --config ./webpack.config.js"
  },
  "keywords": []."author": ""."license": "ISC"."dependencies": {
    "css-loader": "^ 5.2.6." "."mini-css-extract-plugin": "^ 1.6.0." "."webpack": "^ 5.39.1"."webpack-cli": "^ 4.7.2." "}}Copy the code

NPM run dev, wepback will create a new dist directory in the root directory. Any CSS files introduced in the main.js entry file will be packaged into a single CSS file.

The main. CSS file contains the contents of a.ss, B.ss, C.ss, and D.ss at the same time. As long as the names do not conflict, you can directly import the main. CSS file where you want. The mapping file is also saved in the main.css.map file, as shown below:

This demo download address: https://s.yezgea02.com/1624090152147/webpack-demo.zip, interested can download to look at.

What does moOCs’ alleged plagiarism have to do with WebPack loading on demand?

Moocs are suspected of copying my open source project, which I have already published several articles about. Recently, I have been organizing the materials for the prosecution. I mainly collect evidence according to the contents of the notarized materials.

  • “Newbee-mall open source project was used as a course by MOOCs, but I had no knowledge of it. What kind of operation is this?”
  • “Newbee-mall open source project was used by MOOCs as a course, detailed comparison and record of the project, see here for more details”
  • An open source mall project used by MOOCs as the ultimate project of Java employment class. I recommend it to you.
  • “I spent 3680 yuan to buy a Java employment course on MOOCs, and there was an open source project written by myself!”
  • “Newbee-mall Open source project was taken by MOOCs to make a course, the lecturer has apologized, but the course is still on sale”
  • Funny! Moocs are suspected of copying open source projects, so far they have not apologized, and are secretly “destroying bodies”

We have compared the project page, project design and so on. The lawyer told me that the evidence could be used, but it would be better to compare it with the code. Through project the visual effect of proportion of repetition, and code to prove that there is plagiarism, because of our country’s copyright law on copyright infringement decision rule is “contact + substantially similar”, “infringement = contact + substantially similar” is widely accepted and performed in judicial practice rules, belongs to the general common standards of copyright infringement.

If there is direct evidence on both the visuals of the project and the ratio of code duplication, it would be more advantageous to prove that the mooC project is “materially similar” to the Newbee-Mall project. So, not only do I write articles and respond to comments, but I spend most of my energy on code comparison recently, and the results of the comparison are hilarious, because the code duplication is too high, a lot of code is directly copied from the past.

When it comes to code comparison, webPack’s on-demand loading technology is involved.

The name of the course suspected of being copied by MOOCs is Java Engineer. I have purchased the course at the notary office and the purchase process has been notarized. At the same time, I have downloaded the project code suspected of plagiarism in this course, and the downloading process has been notarized. This notarized code compression package is used when sorting out evidence. After decompression, the source code of the project can be seen, as shown in the figure below:

These are style files and page files. As you can see, the code is all processed, and if you open it directly, it is very difficult to compare the code. The most likely way is webPack compression. The name is [name].[hash].chunk.js, as described in the practical code configuration in the previous section. Add a configuration of chunkFilename. This way, the style files and page code files for the home page, search page, product details page, shopping cart page, order page, and so on can all be compressed into one file. As a developer, hammer man’s way is relatively simple and direct, directly the principle of a simple analysis, and then analyze the code.

Okay, here we go.

Moocs are suspected of copying the code comparison of the open source project Newbee-Mal

Although also published a number of articles before, but did not put the project source comparison issued. As a result, a lot of netizens questioned that I was a publicity stunt, that I was a xianglin sister-in-law, that there must be a reversal of the case, and that MOOCs would surely come up with evidence to hit me in the face. Okay, I’ve been waiting for a reversal, I’ve been waiting for a MOOCs to hit me in the face, and it hasn’t happened yet, so let’s go ahead and release the evidence. This time, the evidence is more direct. The code of the final project of Java Engineer on MOOCs is suspected of copying Newbee-Mall on a large scale. Through the visual comparison and code comparison of the project, it can be seen that the similarity of the page display effect is more than 95%, and the code repetition is more than 90%. The comparison of the display effect is in the previous article, and the content of this article is mainly the code comparison.

All right, let’s get some eyes!

Enter imooc – mall/SRC/main/resources/static folder, use the browser to open the folder of the index. The HTML file, effect as shown in the figure below:

Right-click “Check” on the page or hold down the F12 key to go to the browser’s console. Enter the Sources panel, and successively click the folder to the CSS directory, as shown in the figure below, you can see the page source code of The Mu Mu Fresh project:

The files in the static/static/ CSS directory above are not visible in the source code, but this does not mean that the files do not exist, but that the code is compressed. Source code files in the main. 9 a3b9d8e. The chunk. The CSS file is the compressed file, the browser to render the page will be sent to you by the main. 9 a3b9d8e. The chunk. The CSS. The map file to the source code for on-demand loaded. So it’s not that the source code doesn’t exist, it’s compressed. Main. 9 a3b9d8e. The chunk. The CSS. The map will maintain the mapping relationship of the file, open file can see mapping configuration:

{"version":3."sources": ["index.css"."App.css"."login.css"."header.css"."pay.css"."main.9a3b9d8e.chunk.css"."iconfont.css"."common.css"."cart.css"."sweetalert.css"."detail.css"."index.scss"."header.scss"."detail.scss"."personal.css"."my-orders.css"."bootstrap-modal.css"."order-detail.css"."order-settle.css"."order-detail.scss"."pay-select.css"."personal.scss"."search.css"]."names": []Copy the code

The code for all these source files is compressed into main.9a3b9d8E.chunk.css.

Ok, next, click on these files in turn through the browser and compare them to the files in the Newbee-Mall project:

Index. CSS Code comparison

The above figure is the index. CSS source file of The Mu Mu Fresh project, and the below is the index. CSS source file of the Newbee-Mall project:

.all-sort-list {
    position: relative;
    float: left;
    width: 228px;
    border-top: none;
    background: # 000;
    height: 100%;
}

.all-sort-list .item {
    height: 49px;
    border-top: 1px solid #FFFFFF;
}

.all-sort-list .item.bo {
    border-top: none;
}

.all-sort-list .item h3 {
    height: 30px;
    line-height: 45px;
    font-size: 15px;
    font-weight: normal;
    width: 199px;
    overflow: hidden;
}

.all-sort-list .item span {
    padding: 0px 5px;
    color: #1baeae;
    font-family: "\5B8B\4F53";
}
Copy the code

Only the first 50 lines of code comparison are provided here. The complete source code comparison will be arranged in another attachment as evidence material.

The final comparison conclusion: the file name is exactly the same, the code duplication rate is 98%, complete plagiarism!

Header. CSS code comparison

The above image shows the header. CSS source file of the Mou Fresh project, and the following is the header. CSS source file of the Newbee-Mall project:

#header {
    display: flex;
    justify-content: center;
    width: 100%;
    height: 40px;
    background-color: # 333;
}

#header .center {
    width: 1226px;
    height: 40px;
    flex-shrink: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#header .center ul li a {
    display: flex;
    align-items: center;
    height: 12px;
    font-size: 14px;
    color: #b0b0b0;
    padding: 0 8px;
    border-right: 1px solid #b0b0b0;
}

#header .center ul li:last-of-type a {
    border-right: none;
}

#header .center .fl {
    flex-shrink: 0;
    display: flex;
    width: 680px;
}

#header .center .fr {
    display: flex;
    height: 40px;
}
Copy the code

Only the first 40 lines of code comparison are provided here. The complete source code comparison will be arranged in another attachment as evidence material.

The final comparison conclusion: the file name is exactly the same, the code duplication is 99%, complete plagiarism!

Login. CSS code comparison

The above figure is the login. CSS source file in the Mu Mu fresh project, and the lower part is the login. CSS source file in the Newbee-Mall project:

body {
    background: #14212a;
}

.top {
    width: 100%;
    height: 100px;
    background: #fff;
}

.top .logo {
    width: 1130px;
    height: 160px;
}

.top .logo img {
    border: none;
    margin-top: -15px;
}

.form {
    width: 1130px;
    height: 588px;
    background: url(".. /image/login_bg.png") no-repeat center center;
}

.form .login {
    width: 400px;
    height: 470px;
    margin: 30px auto;
    background: # 444;
    color: #fff;
    margin-right: 0px;
    border-radius: 4px;
    font: 12px "宋体", Times New Roman;
}
Copy the code

Only the first 36 lines of code comparison are provided here. The complete source code comparison will be arranged in the other attachment as evidence material.

The final comparison conclusion: the file name is exactly the same, the code duplication is 99%, complete plagiarism!

In addition to the code plagiarism listed above, CSS file, cart.css file, personal. CSS file, common.css file, search.css file, my-orders. CSS file, order-detail.css file, and order-settle , pay. CSS file, pay-selecte. CSS file, the code duplication of these files basically reached 100%. The complete source code comparison will be arranged in the other attachment as evidence material.

The page style code was completely copied, and the newbee-Mall page code was widely copied.

The files in the static/static/js/pages directory in the figure above are the source code of each page of Munu. This part of the code is also not directly visible in the source file, which is also compressed. Source code files in the main. Ed04a20c. The chunk. Js file is the compressed file, the browser to render the page will be sent to you by the main. Ed04a20c. The chunk. Js. The map file to the source code for on-demand loaded. So it’s not that the source code doesn’t exist, it’s compressed. Main. Ed04a20c. The chunk. Js. The map will maintain the mapping relationship of the file, open file can see mapping configuration:

{"version":3."sources": ["assets/image/login-logo-2.png"."assets/logo2.png"."assets/image/pay/payOnline_zsyh.png"."assets/image/pay/payOnline_gsyh.png"."assets/image/pay/payOnline_jsyh.png"."assets/image/pay/payOnline_jtyh.png"."assets/image/pay/payOnline_zgyh.png"."assets/image/pay/payOnline_gdyh.png"."assets/image/pay/payOnline_xyyh.png"."assets/logogif.gif"."assets/11.jpg"."assets/image/7d.jpg"."assets/image/hua.png"."assets/image/card.png"."assets/image/ji.png"."assets/banner10.jpg"."assets/banner11.jpg"."assets/banner12.jpg"."assets/image/pay/payOnline_zfb.png"."assets/image/pay/weixinpay.png"."assets/image/pay/unionpay.png"."assets/image/pay/payOnline_nyyh.png"."assets/image/pay/payOnline_youzheng.png"."assets/image/pay/payOnline_gfyh.png"."assets/image/pay/payOnline_pufa.png"."assets/image/pay/payOnline_zxyh.png"."assets/image/pay/payOnline_shncsyyh.png"."assets/image/pay/payOnline_jiangsshuyh.png"."assets/image/pay/wxpay_qrcode.png"."logo.svg"."assets/image/pay/alipay_qrcode.png"."assets/image/sub_banner/r4.jpg"."assets/image/sub_banner/hot2.jpg"."assets/image/sub_banner/hot3.jpg"."assets/image/sub_banner/hot4.jpg"."assets/image/sub_banner/m6.jpg"."assets/image/sub_banner/headphones.jpg"."assets/image/sub_banner/pc.jpg"."assets/image/sub_banner/air.jpg"."assets/image/sub_banner/baby-car.jpg"."assets/image/sub_banner/r1.jpg"."assets/image/sub_banner/r2.jpg"."assets/image/sub_banner/r3.jpg"."assets/image/sub_banner/r5.jpg"."assets/image/sub_banner/r6.jpg".".. /node_modules/moment-mini/locale sync /^/.//.*$"."assets/image/search/[email protected]"."http.js"."api.js"."pages/login.js"."pages/alipay.js"."pages/footer.js"."pages/cart.js"."pages/components/header-fragment.js"."pages/components/nav-fragment.js"."pages/detail.js"."pages/header.js"."pages/index.js"."pages/personal-sidebar.js"."pages/my-orders.js"."pages/order-detail.js"."http2.js"."pages/order-settle.js"."pages/pay-select.js"."pages/personal.js"."pages/register.js"."pages/search.js"."pages/wxpay.js"."App.js"."serviceWorker.js"."index.js"]
Copy the code

Desire for fresh all code page source file is compressed into the main. Ed04a20c. The chunk. Js. The map file.

Ok, next, click on each of these files in turn through your browser and compare them to the files in the Newbee-Mall project.

Home page code comparison

Above is the source file of index page in Mu Mu Fresh project, and below is the source file of index page in Newbee-Mall project:

    <div id="banner">
        <div class="all-sort-list">
            <th:block th:each="category : ${categories}">
            <div class="item"> < h3 > < span > < / span > < a href ="# #"><th:block th:text="${category.categoryName}"></th:block></a></h3>
                <div class="item-list clearfix">
                    <div class="subitem">
                        <th:block th:each="secondLevelCategory : ${category.secondLevelCategoryVOS}">
                        <dl class="fore1">
                            <dt><a href="#"><th:block th:text="${secondLevelCategory.categoryName}"></th:block></a></dt>
                            <dd>
                                <th:block th:each="thirdLevelCategory : ${secondLevelCategory.thirdLevelCategoryVOS}">
                                <em><a href="#"th:href="@{'/search? goodsCategoryId='+${thirdLevelCategory.categoryId}}">
                                    <th:block th:text="${thirdLevelCategory.categoryName}"></th:block>
                                </a></em>
                                </th:block>
                            </dd>
                        </dl>
                        </th:block>
                    </div>
                </div>
            </div>
            </th:block>
        </div>
        <div class="swiper-container fl">
            <div class="swiper-wrapper"> <! -- If the unicast diagram is configured, the unicast diagram configured in the background is displayed. --> <th:block th:unless="${#lists.isEmpty(carousels)}">
                    <th:block th:each="carousel : ${carousels}">
                        <div class="swiper-slide">
                            <a th:href="@{${carousel.redirectUrl}}">
                                <img th:src="@{${carousel.carouselUrl}}" alt=""> </a> </div> </th:block> </th:block> <! -- The default three rosters are displayed if the rosters are not configured. --> <th:block th:if="${#lists.isEmpty(carousels)}">
                    <div class="swiper-slide">
                        <img src="./mall/image/swiper/banner01.jpg" alt="">
                    </div>
                    <div class="swiper-slide">
                        <img src="./mall/image/swiper/banner02.jpg" alt="">
                    </div>
                    <div class="swiper-slide">
                        <img src="./mall/image/swiper/banner03.jpg" alt="">
                    </div>
                </th:block>
            </div>
            <div class="swiper-pagination"></div>
            <div class="swiper-button-prev"></div>
            <div class="swiper-button-next"></div>
        </div>
    </div>
Copy the code

Only the code comparison of the first 63 lines is provided here. The complete source code comparison will be arranged in another attachment as evidence material.

The final comparison conclusion: the code repetition rate is more than 80%, not only copied the page code, but also copied the comments written during development, which is complete plagiarism!

Product details page code comparison

The above picture is the source file of the product page of The Mou Fresh project, and the lower one is the source file of the product details page of the Newbee-Mall project:

<divid="detail"> <! --nav -->
    <nav th:replace="mall/header::nav-fragment"></nav>

    <div class="dc">
        <div class="content w">
            <div class="title fl""> <div class="clear"></div>
        </div>
    </div>

    <div class="intro mt20 w clearfix">
        <div class="left fl" style="position: relative;">
            <div class="swiper-container fl">
                <img th:src="@{${goodsDetail.goodsCoverImg}}">
            </div>
        </div>
        <div class="right fr">
            <div class="h3 ml20 mt20" th:text="${goodsDetail.goodsName}">NewBeeMall</div>
            <div class="sub_title mr40 ml20 mt10" th:text="${goodsDetail.goodsIntro}">NewBeeMall</div>
            <div class="item_price mr40 ml20 mt10">
                <th:block th:text="${goodsDetail. SellingPrice} + '. 00 yuan"></th:block>
                <del>
                    <th:block th:text="${goodsDetail. OriginalPrice} + '. 00 yuan"></th:block>
                </del>
            </div>

            <div class="order">
                <input class="car" type="button" th:onclick="'saveAndGoCart('+${goodsDetail.goodsId}+')'" value="Buy Now"/>
                <input class="car" type="button" th:onclick="'saveToCart('+${goodsDetail.goodsId}+')'" value="Add to cart"/>
            </div>
            <div class="tb-extra ml20" id="J_tbExtra">< dl> <dt> Promise </dt> <dd><a class="J_Cont" title="To meet the 7 days without reason to return the application under the premise of free postage goods need to be borne by the buyer return postage, non-free postage goods need to be borne by the buyer delivery and return postage." href="#"
                           target="_blank"><img th:src="@{/mall/image/7d.jpg}">7</a></dd> </dl> <dl> <dt> Pay </dt> <dd><a href="# #" target="_blank"><img th:src="@{/mall/image/hua.png}"Word-wrap: break-word! Important; ">< span style =" max-width: 100%; clear: both"# #"
                                                                                                     target="_blank"><img
                            th:src="@{/mall/image/card.png}"><a href="# #" target="_blank"><img
                            th:src="@{/mall/image/ji.png}"> set points treasure < / a > < / dd > < / dl > < dl > < dt > support < / dt > < dd > depreciation cash, buy a new more economical. <a style="float:none; text-decoration: underline;" href="# #"</a></dd> </dl> </div> <div class="clear"></div> </div> <! <div class= <div class= <div class= <div class= <div class= <div class= <div class= <div class= <div class= <div class= <div class= <div class= <div class= <div class= <div class="goods mt20 w clearfix" th:utext="${goodsDetail.goodsDetailContent}">
    </div>
</div>
Copy the code

Only the first 65 lines of code comparison are provided here. The complete source code comparison will be arranged in another attachment as evidence material.

The final comparison conclusion: the code duplication is more than 90%, not only copied the page code, even the copy is completely copied, this is a naked plagiarism!

In addition to the code plagiarism listed above, Js file, register.js file, header.js file, search.js file, cart.js file, personal.js file, personal-sidebar.js file, pay-select.js file, order-s file Js file, my-orders.js file, order-detail.js file, order-settle. Js file, alipay. The complete source code comparison will be arranged in additional attachments as evidence.

We will answer questions that everyone is concerned about

Aren’t open source projects available to everyone?

This question is really asked by many people.

That said, it’s true that the open source project itself puts all the code out there, so it’s true that anyone can use it. Including the newbee-Mall project, you can download all the code, source files, you can use to learn, you can use to make things.

However, the project is open source, does not mean that the author has given up all rights. No rules no circumference, change a logo, change a name, said that their own project, this is not good. Mu mu fresh this suspected of plagiarism is absolutely problematic, the source code to change, change the project name, change the project LOGO, the original author of all copyright information deleted, claiming to be their own original project, this is a criminal act. Pick up chopsticks to eat, put down chopsticks scold niang, this kind of behavior is to despise.

On the other hand, what would you do if you were the author of the Newbee-Mall project?

Why do you keep Posting? Is it useful to send articles?

Useful!

Do not send the article, the pain of plagiarism and plagiarism is nowhere to express, I can only be bullied for nothing.

Would anyone in the tech community know about this without an article? Now, a lot of people know the cause and effect of this, and the majority of people support it, thank you.

Will MOOCs edit the course without Posting the article? Now, they are afraid, have been the contents of the course content suspected of infringement of all “destroyed corpse trace”.

Will I get an apology if I don’t post the article? Now, I have only received an apology from a suspected lecturer, a moOCs apology, I am waiting for you!

Without the article, will MOOCs legal contact my lawyer? Now, both sides have been in communication, nevertheless the other side is still so proud jiao, suspected of breaking the law is you, ok? !!!!! Have no idea what’s going on?

How to see your article every day, only complain, how like xianglinsao?

I did not publish articles every day, now I still write one article a week, the same as before, and I will mention this in passing.

I and Xianglin sister-in-law is different, although we face the situation is “Wolf” snatched the child, but I have been in action, has been in the voice. And, without complaining, I’ve been explaining the cause and effect and what happened in the process, just as it was. In addition, FROM the very beginning, I did a lot of rights protection actions, such as collecting evidence, notarization, evidence preservation, finding lawyers and preparing prosecution materials. So, this is not plagiarism and plagiarism after the complaint, we can not understand. All my actions are for rights protection, and I have been in the real thing to do rights protection. The charges are expected by July, this week or next week.

All you do is post articles. Can’t you just Sue?

The road must be walked step by step.

Do you think everything can be done in a flash? Is suing as simple as taking a breath?

It has only been a month since I knew this. In the first half month, I was checking the existence of plagiarism and looking for a lawyer. The actual exposure and preparation of the evidence started in the middle of June, and a lot of pre-prosecution preparation has been done, but the preparation of the material and evidence takes time. After finishing, will actually go to court to Sue.

You’re the only one who said anything about MOOCs. You must be a ghost!

Hahahahahahaha.

This kind of words, although the person that say little, but return true have a few people so leave a message to me! I can’t get the MOOCs to talk, because I’m waiting for their reply. But they never responded. They just hung in there.

But I’m definitely going to keep speaking up, and they’re going to keep speaking up if they can. I will do everything I can to make this known to more and more people, to see the faces of certain platforms. Besides, they can’t be silent all the time, so I’ll see you in court when the charges are filed. They didn’t say a word in court? No way.

You a person in the ba ba say, will definitely reverse, wait for you to snap hit face!

Normal people can see that the purpose of my voice is to defend my rights, not to quarrel. I just put the rights to record things, from the discovery of infringement, to the start of rights protection, and then to the actual practice of rights protection preparatory work and rights protection, and rights protection process, and finally the results and summary of rights protection. I don’t want to quarrel with anyone. I just record what happens to me. I don’t violate any Posting norms of technical communities.

In fact, during the process, I also had some wild thoughts about the time, is this thing will be reversed?

At this point, it’s extremely unlikely. Firstly, the evidence. As can be seen from the evidence I have and the articles I have published, the evidence of suspected plagiarism of MOOCs this time is more and more complete and perfect. Including but not limited to page design plagiarism, creative plagiarism, code plagiarism, copy plagiarism. Through the visual comparison of the project and the code comparison, it can be seen that the similarity of the display effect of the page is more than 95%, and the code repetition is more than 90%. The suspected plagiarism is intentional and active, and the copyright information about me in the project has been deleted, claiming that it is my original project. All of these are evidence compiled from notarized materials.

The second is moOCs behavior and attitude during this period. Moocs have “upgraded” The Java Engineer course overnight since I exposed it, and all of the visible areas I mentioned have been removed. Yes, under my eyes to do the “destruction of corpse trace”, see this kind of behavior, I also laughed for a long time. The difference in behavior and attitude, you should be able to see it very intuitively.

I’m going to keep this straight and smooth, not reverse it.

conclusion

Evidence, materials are almost sorted out, the indictment also let the lawyer began to prepare. For those of you who were hoping for a twist, you were disappointed.

Moocs, as the leading IT education platform in China, should carry the banner of protecting intellectual property, safeguard the legitimate rights and interests of originators, severely crack down on plagiarism, plagiarism and piracy, and set a good example for its peers. Never try to infringe on a developer’s legitimate intellectual property rights from above, and never encourage such abuses. Moocs, your sword should point to the dragon!

I’m programmer thirteen. As for the event that MOOCs modified my open source project Newbee-Mall and sold it online without notice or authorization, I didn’t just write this article, nor did I publish it on one platform. These articles have been published simultaneously on 13 platforms, including Jinri Toutiao, wechat official account, Weibo, Zhihu, Bilibili, Digg gold, Blog Park, CSDN, InfoQ writing platform, Si Fu, 51CTO, OSCHINA, Tencent Cloud + community, all under the name of “Programmer 13”.

I will continue to voice in my wechat public account, follow me to see the details of the event and the latest progress, after all, in other platforms may be inexplicable articles “no”. Also hope that you see the article friends can help forward, thank you again.

If there is a need to reprint friends, indicate the source can be reproduced, or you can contact me for article authorization.

I have been Posting articles, and many friends suggested that I make videos and send them to various video platforms. I can only record the screen, clip and video processing, but not, if you are interested in this matter and have the ability to clip friends can contact me, I will provide all the material, this matter exposure and rights protection record, released to various video platforms.

June 6, 2021 was the first time I spoke out about this incident, and since then I have published six articles in total:

  • “Newbee-mall open source project was used as a course by MOOCs, but I had no knowledge of it. What kind of operation is this?”
  • “Newbee-mall open source project was used by MOOCs as a course, detailed comparison and record of the project, see here for more details”
  • An open source mall project used by MOOCs as the ultimate project of Java employment class. I recommend it to you.
  • “I spent 3680 yuan to buy a Java employment course on MOOCs, and there was an open source project written by myself!”
  • “Newbee-mall Open source project was taken by MOOCs to make a course, the lecturer has apologized, but the course is still on sale”
  • Funny! Moocs are suspected of copying open source projects, so far they have not apologized, and are secretly “destroying bodies”

June 21, 2021, is my fifth time to speak out on this incident, which is the current friends who are reading this article. I will continue to update this rights protection event.

In addition to indicate the reprint/source, all are the author’s original, welcome to reprint, but without the consent of the author must retain this paragraph of statement, and in the article page clearly given the original link, or reserve the right to seek legal responsibility.